<template>
	<view>
		<view class="banner" v-show="isvideo" id="banner1">
			<video id="jswebrtc" :src="videoSrc" autoplay controls @fullscreenchange="onFullscreenChange"
				style="width: 100%; height: 300px; object-fit: fill;position: relative;">
				<!-- 摄像机设备才展示 -->
				<!-- <cover-view style="position: relative;z-index: 100;" v-if="info.equipmentSwitch == 1"> -->
				<cover-view style="position: relative;z-index: 100;" v-if="false">
					<!-- 右上角水印 -->
					<view v-if="logoData.isLogo == 1" class="logoClass">
						<image :src="imageUrl + logoData.logo" mode="widthFix"></image>
					</view>
					<!-- 有比分数据的时候才展示 比分栏 -->
					<!-- <view style="color: red;">是否：{{isFullscreen}}</view>  '340px':'170px'    40px'-->
					<view class="bifen" v-if="scoreObj" :style="videoScoreStyle">
						<view class="calssName">{{scoreObj.contestName}}广东篮球PK挑战赛看看</view>
						<view class="fen-box">
							<view class="item one">
								<view class="name" style="color: #000;">
									{{scoreObj.teamOneName}}
									<view class="itemFg">
										<view v-for="item in 5" class="fgItem"
											:style="{background:(item>scoreObj.homeTeamFoul || !scoreObj.homeTeamFoul)?'white':'red'}">
										</view>
									</view>
								</view>
								<countUp :num="scoreObj.teamOneScore"></countUp>
							</view>
							<!-- 中间三角形 sub-->
							<view class="sanjiao">
								<view style="position: absolute;z-index: 9999;top: -21px;left: -7px;font-size: 10px;">
									{{scoreObj.subsection==1?'1st':scoreObj.subsection==2?'2nd':scoreObj.subsection==3?'3rd':scoreObj.subsection+'th'}}
								</view>
							</view>
							<view class="item two">
								<countUp color="#fff" :num="scoreObj.teamTwoScore"></countUp>
								<view class="name">
									{{scoreObj.teamTwoName}}
									<view class="itemFg">
										<view v-for="item in 5" class="fgItem"
											:style="{background:(item>scoreObj.awayTeamFoul || !scoreObj.awayTeamFoul)?'white':'red'}">
										</view>
									</view>
								</view>
							</view>
						</view>
					</view>
				</cover-view>
			</video>
		</view>
		<view class="banner bannerstatus" id="banner2" v-if="!isvideo">
			<view v-if="info.state == 2" class="liveNum">观看人数：{{ liveNum || 0 }}</view>
			<!-- <image src="https://ydsg-1256672631.cos.ap-guangzhou.myqcloud.com/icon/defaultLiveBackground.jpeg" mode="">
			</image> -->
			<image src="/static/images/dataBg.jpg" mode="">
			</image>
			<view class="info-box">
				<view class="info-title">
					{{ name }}
				</view>
				<view class="tean-box">
					<view>
						<image :src="imageUrl + info.teamOneLogo" mode=""></image>
						<view class="team-name">{{ info.teamOneName }}</view>
					</view>
					<view>
						<view class="time" style="font-size: 29rpx;font-weight: bold;">{{ info.tournamentBeginTime }}
						</view>
						<view class="num">
							{{ info.teamOneScore }}-{{ info.teamTwoScore }}
						</view>
						<view class="state" style="font-size: 29rpx;font-weight: bold;">
							<view v-if="info.state == 0">未开始</view>
							<view v-else-if="info.state == 1">进行中</view>
							<view v-else>已结束</view>
						</view>
					</view>
					<view>
						<image :src="imageUrl + info.teamTwoLogo" mode=""></image>
						<view class="team-name">{{ info.teamTwoName }}</view>
					</view>
				</view>
				<view class="video-box" v-if="info.state != 2" @click="_getLeagueH5LiveBegin()">
					视频直播
				</view>
			</view>
			<!-- <video id="jswebrtc" controls style="width: 100%; height: 300px; object-fit: fill;">

        </video>
        <view class="videoImg" >
          视频观看
        </view> -->
		</view>

		<view style="padding-top: 460rpx" class="main-box">
			<view class="backbtnbody" v-if="info.state != 2 && isBack">
				<button class="backBtn" @click="_getLeagueH5LiveBegin()">
					返回直播
				</button>
			</view>
			<view class="team-body">
				<view class="tab-box">
					<view @click="changeTab(4)" :class="tab == 4 ? 'tab-box-small active' : 'tab-box-small'">互动</view>
					<view @click="changeTab(0)" :class="tab == 0 ? 'tab-box-small active' : 'tab-box-small'">视频</view>
					<view @click="changeTab(1)" :class="tab == 1 ? 'tab-box-small active' : 'tab-box-small'">赛况</view>
					<view @click="changeTab(2)" :class="tab == 2 ? 'tab-box-small active' : 'tab-box-small'">数据</view>
					<view @click="changeTab(3)" :class="tab == 3 ? 'tab-box-small active' : 'tab-box-small'">信息</view>
				</view>
			</view>
			<!-- 互动 -->
			<view class="interact" v-show="tab == 4">
				<div class="interact-box">
					<div style="width: auto; overflow-y: auto" ref="chatWindow" class="chat" id="chat">
						<div style="overflow-y: auto" class="chat-room" id="chat-room" ref="chatRoom">
							<div class="null-show" v-show="messages.length === 0">
								<span>这里空空如也哦~~~</span>
							</div>
							<div id="chatMessages" v-for="message in messages" :key="message.id"
								style="margin-bottom: 10px; text-align: left">
								<div class="user-info-box" v-if="message.userId !== userid">
									<span style="font-weight: bold; margin-right: 10px"
										class="username-span">{{ message.userName }}</span>
									<span style="color: gray; font-size: 12px">{{
                    message.createTime
                  }}</span>
								</div>
								<div class="user-info-box-self" v-else>
									<span
										style="color: gray; font-size: 12px; margin-right: 10px">{{ message.createTime }}</span>
									<span style="font-weight: bold; margin-right: 10px"
										class="username-span">{{ message.userName }}</span>
								</div>
								<div class="user-mes-box" v-if="message.userId !== userid">
									<div class="user-image">
										<image :src="message.userImg" mode="widthFix"></image>
									</div>
									<div class="message-detail">
										<div class="message">
											{{ message.context }}
										</div>
									</div>
								</div>
								<div class="user-mes-box-self" v-else>
									<div class="message-detail">
										<div class="message">
											{{ message.context }}
										</div>
									</div>
									<div class="user-image">
										<image :src="message.userImg" mode="widthFix"></image>
									</div>
								</div>
							</div>
						</div>
						<div class="edit-message" v-show="loginBtn">
							<div style="width: 100%">
								<input :disabled="isIng != 1" :class="{ 'not-ing-input': isIng != 1 }"
									v-model="newMessage" style="left: auto" placeholder="请输入消息内容" />
								<button :disabled="isIng != 1" :class="{ 'not-ing-button': isIng != 1 }"
									@click="sendMessage">
									发送
								</button>
							</div>
						</div>
						<div class="wx-login">
							<button @click="handleLogin" v-show="!loginBtn">微信登录</button>
						</div>
					</div>
				</div>
			</view>

			<!-- 视频 -->
			<view class="video" v-show="tab == 0">
				<view class="playList" v-if="tab == 0">
					<view class="playBox" v-for="(item, index) in playerList.oneTeam
              .baseBasketballPlayersList" @click="changePlayer(item.id)">
						<view :class="item.id == playerId ? 'playName active' : 'playName'">{{ item.name }}</view>
						<view :class="item.id == playerId ? 'playNum active2' : 'playNum'">{{ item.playerNumber }}号
						</view>
					</view>
					<view class="playBox" v-for="(item, index) in playerList.twoTeam
              .baseBasketballPlayersList" @click="changePlayer(item.id)">
						<view :class="item.id == playerId ? 'playName active' : 'playName'">{{ item.name }}</view>
						<view :class="item.id == playerId ? 'playNum active2' : 'playNum'">{{ item.playerNumber }}号
						</view>
					</view>
				</view>

				<view class="video-title" v-if="tab == 0">{{
          info.state == 2 ? "视频回放&全场集锦" : "视频直播"
        }}</view>
				<!-- <view v-if="info.state != 2">
            <view class="video-img" style="display: flex; align-items: center; justify-content: center;">
              <image src="http://testm.sxjqs.xyz/static/img/sils@3x.a69c9d0.png" mode=""></image>
            </view>
            <view class="none-box" v-if="tab == 0">暂无视频</view>
            <view class="none-box"v-if="tab == 1">暂无赛况</view>
            <view class="none-box" v-else-if="tab == 2">暂无数据</view>
          </view> -->
				<view v-if="tab == 0 && info.state != 0" class="video-back">
					<template v-for="item in liveList">
						<view v-if="item.type == 1" @click="onPlayLive(item.videoUrl)">
							<view>
								<image v-if="imgUrl" :src="sercerImage + imgUrl" mode="widthFix"></image>
								<image v-else src="@/static/images/logo.jpg" mode="widthFix"></image>
							</view>
							<view class="video-text">{{ item.name }}</view>
						</view>
					</template>
				</view>

				<view v-if="tab == 0 && info.state != 0">————————————</view>
				<view v-if="tab == 0 && info.state != 0" class="video-title">视频分切</view>
				<view v-if="tab == 0 && info.state != 0" class="video-back">
					<template v-for="item in liveList">
						<view v-if="item.type == 2" @click="onPlayLive(item.videoUrl)">
							<view>
								<image v-if="imgUrl" :src="sercerImage + imgUrl" mode="widthFix"></image>
								<image v-else src="@/static/images/logo.jpg" mode="widthFix"></image>
							</view>
							<view class="video-text">{{ item.name }}</view>
						</view>
					</template>
				</view>
			</view>

			<view v-if="info.state == 0 && tab != 4 && tab != 3" style="
          background-color: white;
          padding: 40rpx;
          width: 100%;
          display: flex;
          align-items: center;
          justify-content: center;
          flex-wrap: wrap;
        ">
				<view class="video-img" style="
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
          ">
					<image src="http://testm.sxjqs.xyz/static/img/sils@3x.a69c9d0.png" mode=""></image>
				</view>
				<view class="none-box" v-if="tab == 0" style="width: 100%; text-align: center">暂无视频</view>
				<view class="none-box" v-if="tab == 1" style="width: 100%; text-align: center">暂无赛况</view>
				<view class="none-box" v-else-if="tab == 2" style="width: 100%; text-align: center">暂无数据</view>
			</view>

			<!-- 数据 -->
			<view class="dataBox" v-show="tab == 2 && info.state !== 0">
				<view class="dataBox-title" style="display: flex;justify-content: space-between;align-items: center;">
					<text style="font-weight: bold;color: #000;">本场最佳</text>
					<!-- <text style="font-size: 34rpx;color: #000;" @click="getPdf">技术统计导出</text> -->
					<view class="f-y-c">
						<view class="btn-primary-border bs16 p1 f24 mr20" @click="ongetCanvas()">数据报告</view>
						<view class="btn-primary-border bs16 p1 f24" @click="getPdf">技术统计导出</view>
					</view>
				</view>
				<view class="good">
					<view class="good-oneTeam">
						<view class="good-oneTeam-list" v-for="(item, ind) in oneTeamList" :key="ind">
							<view class="good-oneTeam-list-left">
								<view>
									<image :src="
                      imageUrl + item.profilePicture ||
                      'http://static.woaoocdn.com/user_head_default.png'
                    " mode=""></image>
								</view>
								<view class="dataBox-goodList-name">{{ item.playerName }}</view>
							</view>
							<view class="dataBox-goodList-name">{{
                item.totalCount || "--"
              }}</view>
						</view>
					</view>
					<view class="good-type">
						<view class="good-type-text">得分</view>
						<view class="good-type-text">篮板</view>
						<view class="good-type-text">助攻</view>
					</view>
					<view class="good-oneTeam">
						<view class="good-oneTeam-list" v-for="(item, ind) in twoTeamList" :key="ind">
							<view class="dataBox-goodList-name">{{
                item.totalCount || "--"
              }}</view>
							<view class="good-oneTeam-list-left">
								<view class="dataBox-goodList-name">{{ item.playerName }}</view>
								<view>
									<image :src="
                      imageUrl + item.profilePicture ||
                      'http://static.woaoocdn.com/user_head_default.png'
                    " mode=""></image>
								</view>
							</view>
						</view>
					</view>
				</view>
				<view style="background-color: #efefef;height: 20rpx;width: 100%;"></view>
				<view class="dataBox-tab">
					<view class="team-body1">
						<view class="tab-box1">
							<view @click="tabTeamClick(0)"
								:class="tabsTeamIndex == 0 ? 'tab-box-small2 active2' : 'tab-box-small2'">
								球队对比
							</view>
							<view @click="tabTeamClick(1)"
								:class="tabsTeamIndex == 1 ? 'tab-box-small2 active2' : 'tab-box-small2'">
								场均对比
							</view>
							<view @click="tabTeamClick(2)"
								:class="tabsTeamIndex == 2 ? 'tab-box-small2 active2' : 'tab-box-small2'">
								赛季对比
							</view>
						</view>
					</view>
				</view>
				<!-- 球队对比  v-if="tabsTeamIndex==0"-->
				<view class="compare">
					<view class="compare-title"> {{teamTitle}}得分 </view>
					<view class="compare-score">
						<view>{{ oneTeam.score }}</view>
						<view class="line-box">
							<view class="line">
								<view class="active" :style="{
					  width: getPice(oneTeam.score, oneTeam.score + twoTeam.score),
					}">
								</view>
							</view>
							<view class="line">
								<view class="active2" :style="{
					  width: getPice(twoTeam.score, oneTeam.score + twoTeam.score),
					}">
								</view>
							</view>
						</view>
						<view>{{ twoTeam.score }}</view>
					</view>
					<view class="compare-title"> {{teamTitle}}篮板 </view>
					<view class="compare-score">
						<view>{{ oneTeam.lb }}</view>
						<view class="line-box">
							<view class="line">
								<view class="active" :style="{
                    width: getPice(oneTeam.lb, oneTeam.lb + twoTeam.lb),
                  }">
								</view>
							</view>
							<view class="line">
								<view class="active2" :style="{
                    width: getPice(twoTeam.lb, oneTeam.lb + twoTeam.lb),
                  }">
								</view>
							</view>
						</view>
						<view>{{ twoTeam.lb }}</view>
					</view>
					<view class="compare-title"> {{teamTitle}}二分 </view>
					<view class="compare-score">
						<view>{{ oneTeam.ef }}</view>
						<view class="line-box">
							<view class="line">
								<view class="active" :style="{
                    width: getPice(oneTeam.ef, oneTeam.ef + twoTeam.ef),
                  }">
								</view>
							</view>
							<view class="line">
								<view class="active2" :style="{
                    width: getPice(twoTeam.ef, oneTeam.ef + twoTeam.ef),
                  }">
								</view>
							</view>
						</view>
						<view>{{ twoTeam.ef }}</view>
					</view>
					<view class="compare-title"> {{teamTitle}}三分 </view>
					<view class="compare-score">
						<view>{{ oneTeam.sf }}</view>
						<view class="line-box">
							<view class="line">
								<view class="active" :style="{
                    width: getPice(oneTeam.sf, oneTeam.sf + twoTeam.sf),
                  }">
								</view>
							</view>
							<view class="line">
								<view class="active2" :style="{
                    width: getPice(twoTeam.sf, oneTeam.sf + twoTeam.sf),
                  }">
								</view>
							</view>
						</view>
						<view>{{ twoTeam.sf }}</view>
					</view>
					<view class="compare-title"> {{teamTitle}}罚球 </view>
					<view class="compare-score">
						<view>{{ oneTeam.fq }}</view>
						<view class="line-box">
							<view class="line">
								<view class="active" :style="{
                    width: getPice(oneTeam.fq, oneTeam.fq + twoTeam.fq),
                  }">
								</view>
							</view>
							<view class="line">
								<view class="active2" :style="{
                    width: getPice(twoTeam.fq, oneTeam.fq + twoTeam.fq),
                  }">
								</view>
							</view>
						</view>
						<view>{{ twoTeam.fq }}</view>
					</view>
					<view class="compare-title"> {{teamTitle}}盖帽 </view>
					<view class="compare-score">
						<view>{{ oneTeam.gm }}</view>
						<view class="line-box">
							<view class="line">
								<view class="active" :style="{
                    width: getPice(oneTeam.gm, oneTeam.gm + twoTeam.gm),
                  }">
								</view>
							</view>
							<view class="line">
								<view class="active2" :style="{
                    width: getPice(twoTeam.gm, oneTeam.gm + twoTeam.gm),
                  }">
								</view>
							</view>
						</view>
						<view>{{ twoTeam.gm }}</view>
					</view>
					<view class="compare-title"> {{teamTitle}}助攻 </view>
					<view class="compare-score">
						<view>{{ oneTeam.zg }}</view>
						<view class="line-box">
							<view class="line">
								<view class="active" :style="{
                    width: getPice(oneTeam.zg, oneTeam.zg + twoTeam.zg),
                  }">
								</view>
							</view>
							<view class="line">
								<view class="active2" :style="{
                    width: getPice(twoTeam.zg, oneTeam.zg + twoTeam.zg),
                  }">
								</view>
							</view>
						</view>
						<view>{{ twoTeam.zg }}</view>
					</view>
					<view class="compare-title"> {{teamTitle}}抢断 </view>
					<view class="compare-score">
						<view>{{ oneTeam.qd }}</view>
						<view class="line-box">
							<view class="line">
								<view class="active" :style="{
                    width: getPice(oneTeam.qd, oneTeam.qd + twoTeam.qd),
                  }">
								</view>
							</view>
							<view class="line">
								<view class="active2" :style="{
                    width: getPice(twoTeam.qd, oneTeam.qd + twoTeam.qd),
                  }">
								</view>
							</view>
						</view>
						<view>{{ twoTeam.qd }}</view>
					</view>
					<view class="compare-title"> {{teamTitle}}犯规 </view>
					<view class="compare-score">
						<view>{{ oneTeam.fg }}</view>
						<view class="line-box">
							<view class="line">
								<view class="active" :style="{
                    width: getPice(oneTeam.fg, oneTeam.fg + twoTeam.fg),
                  }">
								</view>
							</view>
							<view class="line">
								<view class="active2" :style="{
                    width: getPice(twoTeam.fg, oneTeam.fg + twoTeam.fg),
                  }">
								</view>
							</view>
						</view>
						<view>{{ twoTeam.fg }}</view>
					</view>
					<view class="compare-title"> {{teamTitle}}罚球命中率 </view>
					<view class="compare-score">
						<view>{{ Math.ceil(oneTeam.pointRate*100) }}%</view>
						<view class="line-box">
							<view class="line">
								<view class="active" :style="{
					  width: getPice(oneTeam.pointRate, oneTeam.pointRate + twoTeam.pointRate),
					}">
								</view>
							</view>
							<view class="line">
								<view class="active2" :style="{
					  width: getPice(twoTeam.pointRate, oneTeam.pointRate + twoTeam.pointRate),
					}">
								</view>
							</view>
						</view>
						<view>{{ Math.ceil(twoTeam.pointRate*100) }}%</view>
					</view>
					<view class="compare-title"> {{teamTitle}}二分命中率 </view>
					<view class="compare-score">
						<view>{{ Math.ceil(oneTeam.twoPointRate*100) }}%</view>
						<view class="line-box">
							<view class="line">
								<view class="active" :style="{
					  width: getPice(oneTeam.twoPointRate, oneTeam.twoPointRate + twoTeam.twoPointRate),
					}">
								</view>
							</view>
							<view class="line">
								<view class="active2" :style="{
					  width: getPice(twoTeam.twoPointRate, oneTeam.twoPointRate + twoTeam.twoPointRate),
					}">
								</view>
							</view>
						</view>
						<view>{{ Math.ceil(twoTeam.twoPointRate*100) }}%</view>
					</view>
					<view class="compare-title"> {{teamTitle}}三分命中率 </view>
					<view class="compare-score">
						<view>{{ Math.ceil(oneTeam.threePointRate*100) }}%</view>
						<view class="line-box">
							<view class="line">
								<view class="active" :style="{
					  width: getPice(oneTeam.threePointRate, oneTeam.threePointRate + twoTeam.threePointRate),
					}">
								</view>
							</view>
							<view class="line">
								<view class="active2" :style="{
					  width: getPice(twoTeam.threePointRate, oneTeam.threePointRate + twoTeam.threePointRate),
					}">
								</view>
							</view>
						</view>
						<view>{{ Math.ceil(twoTeam.threePointRate*100) }}%</view>
					</view>
				</view>

				<!-- 各节比分 等tab栏 -->
				<view style="background-color: #efefef;height: 20rpx;width: 100%;"></view>
				<view class="dataBox-tab">
					<view class="team-body1">
						<view class="tab-box1">
							<view @click="tabClick(0)"
								:class="tabsIndex == 0 ? 'tab-box-small2 active2' : 'tab-box-small2'">
								各节比分
							</view>
							<view @click="tabClick(1)"
								:class="tabsIndex == 1 ? 'tab-box-small2 active2' : 'tab-box-small2'">
								比分走势
							</view>
							<view @click="tabClick(2)"
								:class="tabsIndex == 2 ? 'tab-box-small2 active2' : 'tab-box-small2'">
								关键数据
							</view>
						</view>
					</view>
					<!-- Q1 各节比分-->
					<view class="teamBig-box" v-if="tabsIndex == 0">
						<view class="teamBig-box-left">
							<view class="oneTemeList" style="color: #000;font-weight: bold;"> 球队 </view>
							<view class="oneTemeList">
								{{ info.teamOneName }}
							</view>
							<view class="oneTemeList">
								{{ info.teamTwoName }}
							</view>
						</view>
						<view class="teamBig-box-right">
							<view>
								<scroll-view class="scroll-Y" scroll-y="true" scroll-x="true">
									<view class="score-title">
										<view class="score-title-text"
											style="flex: 0 0 140px;color: #000;font-weight: bold;"
											v-for="(item, key) in qList">
											Q{{ key }}
										</view>
										<view class="score-title-text"
											style="flex: 0 0 140px;color: #000;font-weight: bold;"> 得分 </view>
									</view>
									<view class="score-title" style="border-bottom: 0px">
										<view class="score-title-text" style="flex: 0 0 140px;"
											v-for="(item, key) in qList">
											{{ item }}
										</view>
										<view class="score-title-text" style="flex: 0 0 140px;">
											{{ teamSubsectionScoreSumTotal1 }}
										</view>
									</view>
									<view class="score-title" style="border-bottom: 0px">
										<view class="score-title-text" style="flex: 0 0 140px;"
											v-for="(item, key) in qList1">
											{{ item }}
										</view>
										<view class="score-title-text" style="flex: 0 0 140px;">
											{{ teamSubsectionScoreSumTotal2 }}
										</view>
									</view>
								</scroll-view>
							</view>
						</view>
					</view>
					<!-- 比分走势 -->
					<view v-if="tabsIndex == 1" style="margin-top: 30rpx;">
						<LineChart v-if="lineChartShow" :scoreData="scoreData" />
					</view>
					<!-- 关键数据keyFiguresData -->
					<view v-if="tabsIndex == 2" style="margin: 40rpx 0;">
						<!-- <div class="half-circle"></div> -->
						<view class="half-content">
							<view class="left-text">
								<view class="left-item">
									<image v-if="keyFiguresData.teamOneLogo"
										:src="sercerImage+keyFiguresData.teamOneLogo"></image>
									<image v-else src="@/static/images/logo.jpg"></image>
									<view style="color: #55AA76;">{{keyFiguresData.teamOneName}}</view>
								</view>
								<view class="left-item">
									<image v-if="keyFiguresData.teamTwoLogo"
										:src="sercerImage+keyFiguresData.teamTwoLogo"></image>
									<image v-else src="@/static/images/logo.jpg"></image>
									<view style="color: #03828B;">{{keyFiguresData.teamTwoName}}</view>
								</view>
							</view>
							<!-- 三分或一分：teamOneScoreName -->
							<view>
								<view class="half-circle-box"
									v-if="keyFiguresData.teamOneScore>keyFiguresData.teamTwoScore">
									<div class="half-circle-clip">
										<view class="top-bg">{{getZeroScore(keyFiguresData.teamOneScore)}}</view>
									</div>
									<div class="half-circle-clip gray">
										<view class="top-bg top-gray" style="left: 32% !important;">
											{{getZeroScore(keyFiguresData.teamTwoScore)}}
										</view>
									</div>
									<div class="middle-text">{{keyFiguresData.teamOneScoreName}}</div>
								</view>
								<view class="half-circle-box" v-else style="transform: rotate(180deg);">
									<div class="half-circle-clip">
										<view class="top-bg"
											style="transform: rotate(180deg);left: 32%;bottom: 81%;padding: 6rpx 10rpx 6rpx;">
											{{getZeroScore(keyFiguresData.teamTwoScore)}}
										</view>
									</div>
									<div class="half-circle-clip gray">
										<view class="top-bg top-gray2">
											{{getZeroScore(keyFiguresData.teamOneScore)}}
										</view>
									</div>
									<div class="middle-text" style="transform: rotate(180deg);top: 45%;left: 37%;">
										{{keyFiguresData.teamOneScoreName}}
									</div>
								</view>
							</view>
							<!-- 二分 -->
							<view>
								<view class="half-circle-box"
									v-if="keyFiguresData.teamOneTwoScore>keyFiguresData.teamTwoTwoScore">
									<div class="half-circle-clip">
										<view class="top-bg">{{getZeroScore(keyFiguresData.teamOneTwoScore)}}</view>
									</div>
									<div class="half-circle-clip gray">
										<view class="top-bg top-gray" style="left: 32% !important;">
											{{getZeroScore(keyFiguresData.teamTwoTwoScore)}}
										</view>
									</div>
									<div class="middle-text">二分</div>
								</view>
								<view class="half-circle-box" v-else style="transform: rotate(180deg);">
									<div class="half-circle-clip">
										<view class="top-bg"
											style="transform: rotate(180deg);left: 32%;bottom: 81%;padding: 6rpx 10rpx 6rpx;">
											{{getZeroScore(keyFiguresData.teamTwoTwoScore)}}
										</view>
									</div>
									<div class="half-circle-clip gray">
										<view class="top-bg top-gray2">
											{{getZeroScore(keyFiguresData.teamOneTwoScore)}}
										</view>
									</div>
									<div class="middle-text" style="transform: rotate(180deg);top: 45%;left: 37%;">
										二分</div>
								</view>
							</view>
							<!-- 篮板 -->
							<view>
								<view class="half-circle-box"
									v-if="keyFiguresData.teamOneBackboard>keyFiguresData.teamTwoBackboard">
									<div class="half-circle-clip">
										<view class="top-bg">{{getZeroScore(keyFiguresData.teamOneBackboard)}}</view>
									</div>
									<div class="half-circle-clip gray">
										<view class="top-bg top-gray" style="left: 32% !important;">
											{{getZeroScore(keyFiguresData.teamTwoBackboard)}}
										</view>
									</div>
									<div class="middle-text">篮板</div>
								</view>
								<view class="half-circle-box" v-else style="transform: rotate(180deg);">
									<div class="half-circle-clip">
										<view class="top-bg"
											style="transform: rotate(180deg);left: 32%;bottom: 81%;padding: 6rpx 10rpx 6rpx;">
											{{getZeroScore(keyFiguresData.teamTwoBackboard)}}
										</view>
									</div>
									<div class="half-circle-clip gray">
										<view class="top-bg top-gray2">
											{{getZeroScore(keyFiguresData.teamOneBackboard)}}
										</view>
									</div>
									<div class="middle-text" style="transform: rotate(180deg);top: 45%;left: 37%;">
										篮板</div>
								</view>
							</view>

						</view>
						<view class="bottom-text" @click="goMore">
							更多数据 >
						</view>
					</view>
				</view>

				<view class="dataBox-team">
					<view class="dataBox-team-item" :class="teamIndex==0? 'teamActive':''"
						@click="teamIndex=0;leftValue=0">
						<block v-if="teamIndex==0">
							<image v-if="info.teamOneLogo" :src="sercerImage+info.teamOneLogo"></image>
							<image v-else src="@/static/images/logo.jpg"></image>
						</block>
						<view class="dataBox-team-title">
							<view>{{info.teamOneName}}</view>
							<view>主 <text v-if="info.teamOneRanking">/ {{info.teamOneRanking}}</text></view>
						</view>
					</view>

					<view class="dataBox-team-item" :class="teamIndex==1? 'teamActive':''"
						@click="teamIndex=1;leftValue=0">
						<block v-if="teamIndex==1">
							<image v-if="info.teamTwoLogo" :src="sercerImage+info.teamTwoLogo"></image>
							<image v-else src="@/static/images/logo.jpg"></image>
						</block>
						<view class="dataBox-team-title">
							<view>{{info.teamTwoName}}</view>
							<view>客 <text v-if="info.teamTwoRanking">/ {{info.teamTwoRanking}}</text></view>
						</view>
					</view>
				</view>

				<!-- 战队得分展示板 -->
				<view class="allContent" v-if="teamIndex==0">
					<view class="turnDiv">
						<image class="turnImage turnImageTop" src="@/static/images/xiangxia.png"></image>
						<image class="turnImage" style="left: 20rpx;" src="@/static/images/xiangxia.png"></image>
					</view>
					<view class="teamBig-box"
						style="padding: 0 25rpx 0;position: sticky;top: 86rpx;z-index: 10;background: #fff;">
						<view class="teamBig-box-left">
							<!-- <view class="score-title">得分</view> -->
							<view class="score-title" style="border-bottom: 2rpx solid #efefef;">姓名</view>
						</view>
						<view class="teamBig-box-right">
							<scroll-view style="width: 100%; border-top: 2rpx solid red !important;" scroll-x="true"
								class="scroll-Y" :scroll-left="leftValue" @scroll="handleScroll1">
								<view class="score-title">
									<view class="score-title-text"
										style="border-bottom: 2rpx solid #efefef;color: #000;"> 得分
									</view>
									<view class="score-title-text"
										style="border-bottom: 2rpx solid #efefef;color: #000;"
										v-for="(item, ind) in titleList" :key="ind">
										{{ item.info }}
									</view>
								</view>
							</scroll-view>
						</view>
					</view>
					<view class="teamBig-box" style="padding: 0 25rpx 25rpx;">
						<view class="teamBig-box-left">
							<!-- <view class="score-title">得分</view> -->
							<view class="oneTemeList" v-for="(item, ind) in oneTeamScoreList" :key="ind"
								:style="{'font-weight':ind==oneTeamScoreList.length-1?'bold':''}">
								<view>{{ item.code }}</view>
								<view class="oneTemeList-name">{{ item.name }}</view>
							</view>
						</view>
						<view class="teamBig-box-right">
							<scroll-view style="width: 100%; border-top: 2rpx solid #efefef !important;" scroll-x="true"
								class="scroll-Y" :scroll-left="leftValue" @scroll="handleScroll2">
								<!-- <view class="score-title">
									<view class="score-title-text"> 得分2 </view>
									<view class="score-title-text" v-for="(item, ind) in titleList" :key="ind">
										{{ item.info }}
									</view>
								</view> -->
								<view class="score-title" v-for="(item, ind) in oneTeamScoreList" :key="ind"
									style="border-bottom: 0"
									:style="{'font-weight':ind==oneTeamScoreList.length-1?'bold':''}">
									<!--  -->
									<view class="score-title-text"
										:style="{'color':ind==oneTeamScoreList.length-1?'#000':'#999'}">
										{{ item.typeScoreSum }}
									</view>
									<view class="score-title-text"
										:style="{'color':ind==oneTeamScoreList.length-1?'#000':'#999'}"
										v-for="(itemS, indS) in titleList" :key="indS">
										<text
											v-if="['罚球命中率','二分命中率','三分命中率','效率值','真实命中率'].includes(itemS.info) && item.name=='总计'"></text>
										<text v-else>{{getfen(itemS.code, item.typeMapList)}}</text>
									</view>
								</view>
								<!-- <view class="score-title">
									<view class="score-title-text" v-for="(itemm, idx) in oneTeamTotalScoreList" :key="idx"
										style="font-weight: 600">
										{{ itemm }}
									</view>
								</view> -->
							</scroll-view>
						</view>
					</view>
				</view>
				<view class="allContent" v-if="teamIndex==1">
					<view class="turnDiv">
						<image class="turnImage turnImageTop" src="@/static/images/xiangxia.png"></image>
						<image class="turnImage" style="left: 20rpx;" src="@/static/images/xiangxia.png"></image>
					</view>
					<view class="teamBig-box"
						style="padding: 0 25rpx 0;position: sticky;top: 86rpx;z-index: 10;background: #fff;">
						<view class="teamBig-box-left">
							<!-- <view class="score-title">得分</view> -->
							<view class="score-title" style="border-bottom: 2rpx solid #efefef;">姓名</view>
						</view>
						<view class="teamBig-box-right">
							<scroll-view style="width: 100%; border-top: 2rpx solid #efefef !important;" scroll-x="true"
								class="scroll-Y" :scroll-left="leftValue" @scroll="handleScroll1">
								<view class="score-title">
									<view class="score-title-text"
										style="border-bottom: 2rpx solid #efefef;color: #000;"> 得分
									</view>
									<view class="score-title-text"
										style="border-bottom: 2rpx solid #efefef;color: #000;"
										v-for="(item, ind) in titleList" :key="ind">
										{{ item.info }}
									</view>
								</view>
							</scroll-view>
						</view>
					</view>
					<view class="teamBig-box" style="padding: 0 25rpx 25rpx;">
						<view class="teamBig-box-left">
							<!-- <view class="score-title">得分</view> -->
							<view class="oneTemeList" v-for="(item, ind) in twoTeamScoreList" :key="ind"
								:style="{'font-weight':ind==twoTeamScoreList.length-1?'bold':''}">
								<view>{{ item.code }}</view>
								<view class="oneTemeList-name">{{ item.name }}</view>
							</view>
						</view>
						<view class="teamBig-box-right">
							<scroll-view style="width: 100%; border-top: 2rpx solid #efefef !important" scroll-x="true"
								class="scroll-Y" :scroll-left="leftValue" @scroll="handleScroll2">
								<view class="score-title" v-for="(item, ind) in twoTeamScoreList" :key="ind"
									style="border-bottom: 0"
									:style="{'font-weight':ind==twoTeamScoreList.length-1?'bold':''}">
									<!--  -->
									<view class="score-title-text"
										:style="{'color':ind==twoTeamScoreList.length-1?'#000':'#999'}">
										{{ item.typeScoreSum }}
									</view>
									<view class="score-title-text"
										:style="{'color':ind==twoTeamScoreList.length-1?'#000':'#999'}"
										v-for="(itemS, indS) in titleList" :key="indS">
										<text
											v-if="['罚球命中率','二分命中率','三分命中率','效率值','真实命中率'].includes(itemS.info) && item.name=='总计'"></text>
										<text v-else>{{getfen(itemS.code, item.typeMapList)}}</text>
									</view>
								</view>
								<!-- <view class="score-title">
									<view class="score-title-text" v-for="(itemm, idx) in twoTeamTotalScoreList" :key="idx"
										style="font-weight: 600">
										{{ itemm }}
									</view>
								</view> -->
							</scroll-view>
						</view>
					</view>
				</view>

				<!-- 球员PK -->
				<view style="background-color: #efefef;height: 20rpx;width: 100%;"></view>
				<view>
					<view class="pk-title">球员PK</view>
					<view class="pk-tab">
						<view class="dataBox-pk-item" :class="pkTabIndex==0? 'pkActive':''" @click="pkTabIndex=0">
							本场对比
						</view>
						<view class="dataBox-pk-item" :class="pkTabIndex==1? 'pkActive':''"
							@click="pkTabIndex=1;_getLeagueH5RankingList()">
							个人赛季排行榜
						</view>
					</view>
					<block v-if="pkTabIndex==0">
						<view class="playerPk">
							<view class="p-1" @click="onchangePlayer(1)">
								<image class="playerImage" src="@/static/images/baskerballer.png"></image>
								<view class="playerTitle">
									<text>{{pkUser1}}</text>
									<image src="@/static/images/qiehuan.png"></image>
								</view>
							</view>
							<view class="p-2">
								<!-- 得分 篮板 助攻 投篮 效率值 -->
								<view class="p-2-item">
									<view class="p-2-left" :class="pkDataOne.score>pkDataTwo.score?'colorActive1':''">
										{{pkDataOne.score}}
									</view>
									<view class="p-2-center">得分</view>
									<view class="p-2-right" :class="pkDataOne.score<pkDataTwo.score?'colorActive2':''">
										{{pkDataTwo.score}}
									</view>
								</view>
								<view class="p-2-item">
									<view class="p-2-left"
										:class="pkDataOne.backboard>pkDataTwo.backboard?'colorActive1':''">
										{{pkDataOne.backboard}}
									</view>
									<view class="p-2-center">篮板</view>
									<view class="p-2-right"
										:class="pkDataOne.backboard<pkDataTwo.backboard?'colorActive2':''">
										{{pkDataTwo.backboard}}
									</view>
								</view>
								<view class="p-2-item">
									<view class="p-2-left" :class="pkDataOne.assist>pkDataTwo.assist?'colorActive1':''">
										{{pkDataOne.assist}}
									</view>
									<view class="p-2-center">助攻</view>
									<view class="p-2-right"
										:class="pkDataOne.assist<pkDataTwo.assist?'colorActive2':''">
										{{pkDataTwo.assist}}
									</view>
								</view>
								<view class="p-2-item">
									<view class="p-2-left colorActive1">
										{{pkDataOne.shootPointNum}}/{{pkDataOne.shootTotalNum}}
									</view>
									<view class="p-2-center">投篮</view>
									<view class="p-2-right colorActive2">
										{{pkDataTwo.shootPointNum}}/{{pkDataTwo.shootTotalNum}}
									</view>
								</view>
								<view class="p-2-item">
									<view class="p-2-left" :class="pkDataOne.per>pkDataTwo.per?'colorActive1':''">
										{{pkDataOne.per}}
									</view>
									<view class="p-2-center">+/-</view>
									<view class="p-2-right" :class="pkDataOne.per<pkDataTwo.per?'colorActive2':''">
										{{pkDataTwo.per}}
									</view>
								</view>
							</view>
							<view class="p-1" @click="onchangePlayer(2)">
								<image class="playerImage" src="@/static/images/baskerballer.png"
									style="transform: scaleX(-1) !important;"></image>
								<view class="playerTitle">
									<text>{{pkUser2}}</text>
									<image src="@/static/images/qiehuan.png"></image>
								</view>
							</view>
						</view>
						<view class="playerFenxi" @click="goFenxi">全面分析 ></view>
					</block>
					<block v-if="pkTabIndex==1">
						<view style="padding: 12rpx 32rpx 0;">
							<view class="more-all-second">
								<view class="more-second-tab" :class="moreRankIndex==index? 'moreSecondActive':''"
									v-for="(item,index) in moreRankTabList" :key="index"
									@click="moreTabRankClick(index)">
									{{item}}
								</view>
							</view>
							<view class="leaderboard-title" style="margin-top: 30rpx">
								<view class="leaderboard-title-right">
									<view class="ranking">排名</view>
									<!-- <view class="profilePicture"></view> -->
									<view class="player-name">姓名</view>
									<view class="cansaiqiudui">球队</view>
									<view class="perGame table-perGame">场均</view>
									<view class="all">总计</view>
								</view>
							</view>
							<view class="leaderboard-detail-right-box">
								<view class="leaderboard-detail-right" v-for="(item, ind) in rankingList" :key="ind">
									<view class="left-box">
										<view style="padding: 10rpx 0">
											<image src="@/static/jin.png" mode="" v-if="ind == 0"></image>
											<image src="@/static/yin.png" mode="" v-if="ind == 1"></image>
											<image src="@/static/tong.png" mode="" v-if="ind == 2"></image>
											<view v-if="ind > 2" style="width: 50rpx">
												{{ item.noNum }}
											</view>
										</view>
										<view class="profile-box" style="display: none">
											<image :src="item.profilePicture" mode=""></image>
										</view>
										<view class="zhong-box">
											{{ item.playerName }}
										</view>
										<view class="teamName-box">
											{{ item.teamName }}
										</view>
										<view class="changjun-box">
											{{ item.average }}
										</view>
										<view class="total-box">
											{{ item.totalCount }}
										</view>
									</view>
								</view>
							</view>
						</view>
						<view class="playerFenxi" @click="goRank">更多数据 ></view>
					</block>
				</view>
			</view>

			<view style="background-color: #efefef;height: 20rpx;width: 100%;"></view>
			<!-- 赛况 -->
			<view class="matchResult" v-show="tab == 1 && info.state != 0">
				<view class="list">
					<view class="dian"></view>
					<view class="list-title">
						<view></view>
						<view style="color: #888; font-size: 22rpx">{{
              info.createTime
            }}</view>
					</view>
					<textarea :value="msg" placeholder="" class="list-content" disabled />
				</view>
				<view class="list" v-for="(item, ind) in playerLogList" :key="ind">
					<view class="dian"></view>
					<view class="list-title">
						<view style="font-size: 24rpx">{{ item.name }}</view>
						<view style="color: #888; font-size: 22rpx">{{
              item.createTime
            }}</view>
					</view>
					<view class="list-content">{{ item.typeStr }}</view>
				</view>
			</view>

			<!-- 比赛信息 -->
			<view class="game-info" v-show="tab == 3">
				<view class="game-info-title">比赛信息</view>
				<view class="game-list-info">
					<view class="game-list">
						<view class="game-list-left">
							<view> </view>
							<view>时间</view>
						</view>
						<view>
							{{ info.tournamentBeginTime }}
						</view>
					</view>
					<view class="game-list">
						<view class="game-list-left">
							<view> </view>
							<view>地点</view>
						</view>
						<view>
							{{ info.address }}
						</view>
					</view>
					<view class="game-list">
						<view class="game-list-left">
							<view> </view>
							<view>阶段</view>
						</view>
						<view>
							<view v-if="info.type == 1">小组赛</view>
							<view v-else-if="info.type == 2">淘汰赛</view>
							<view v-else-if="info.type == 3">四强赛</view>
							<view v-else-if="info.type == 4">半决赛</view>
							<view v-else-if="info.type == 5">决赛</view>
							<view v-else-if="info.type == 6">季军赛</view>
							<view v-else-if="info.type == 7">排位赛</view>
							<view v-else-if="info.type == 8">常规赛</view>
							<view v-else>季后赛</view>
						</view>
					</view>
				</view>
				<view class="game-info-title">比赛结果</view>
				<view class="game-list-info">
					<view class="game-list" style="padding: 20rpx 0">
						<view class="game-list-left">
							<view>比赛状态</view>
						</view>
						<view>
							<view v-if="info.state == 0">未开始</view>
							<view v-else-if="info.state == 1">进行中</view>
							<view v-else>已结束</view>
						</view>
					</view>
					<view class="game-list" style="padding: 20rpx 0">
						<view class="game-list-left">
							<view>{{ info.teamOneName }}</view>
						</view>
						<view>
							{{ info.teamOneScore }}
						</view>
					</view>
					<view class="game-list" style="padding: 20rpx 0">
						<view class="game-list-left">
							<view>{{ info.teamTwoName }}</view>
						</view>
						<view>
							{{ info.teamTwoScore }}
						</view>
					</view>
				</view>
			</view>
		</view>

		<uni-popup ref="popup2" type="center" background-color="#fff">
			<!-- 要导出转换的内容 -->
			<view id="content2" class="bs16 p2" :class="!isExport?'pdfContent':''">
				<view class="t-c f30 mb30 wei">
					{{pdfData.homeTeamName}}(主) VS {{pdfData.awayTeamName}}(客) 比赛 技术统计表
				</view>
				<!-- 主球队 -->
				<view class="f24 mb20">
					<view class="wei mb10">比赛球队team(主): {{pdfData.homeTeamName}}</view>
					<view class="c6">
						<view class="mb10">队伍总得分:<text class="wei c0">{{pdfData.homeScore}}</text></view>
						<view class="f-s-c mb10">
							<view class="mr20">第一节:<text class="wei c0">{{pdfData.homeOneScore}}</text></view>
							<view class="mr20">第二节:<text class="wei c0">{{pdfData.homeTwoScore}}</text></view>
							<view class="mr20">第三节:<text class="wei c0">{{pdfData.homeThreeScore}}</text></view>
							<view class="mr20">第四节:<text class="wei c0">{{pdfData.homeFourScore}}</text></view>
							<view class="mr20">第五节:<text class="wei c0">{{pdfData.homeFiveScore}}</text></view>
							<view class="mr20">第六节:<text class="wei c0">{{pdfData.homeSixScore}}</text></view>
							<view class="mr20">第七节:<text class="wei c0">{{pdfData.homeSevenScore}}</text></view>
						</view>
						<view class="f-s-c mb10">
							<view class="mr20">
								<view class="">第一节团队犯规:<text class="wei c0">{{pdfData.homeTeamOneFoul}}</text></view>
								<view class="t-r">团队暂停:<text class="wei c0">{{pdfData.homeTeamOneStop}}</text></view>
							</view>
							<view class="mr20">
								<view class="">第二节团队犯规:<text class="wei c0">{{pdfData.homeTeamTwoFoul}}</text></view>
								<view class="t-r">团队暂停:<text class="wei c0">{{pdfData.homeTeamTwoStop}}</text></view>
							</view>
							<view class="mr20">
								<view class="">第三节团队犯规:<text class="wei c0">{{pdfData.homeTeamThreeFoul}}</text></view>
								<view class="t-r">团队暂停:<text class="wei c0">{{pdfData.homeTeamThreeStop}}</text></view>
							</view>
							<view class="mr20">
								<view class="">第四节团队犯规:<text class="wei c0">{{pdfData.homeTeamFourFoul}}</text></view>
								<view class="t-r">团队暂停:<text class="wei c0">{{pdfData.homeTeamFourStop}}</text></view>
							</view>
						</view>
						<!-- 表格开始 -->
						<view class="table-container">
							<table class="stats-table">
								<tr>
									<th rowspan="2">号码<br>(number)</th>
									<th rowspan="2">球员<br>(player)</th>
									<th colspan="3">2分球<br>(Two Point)</th>
									<th colspan="3">3分球<br>(Three Point)</th>
									<th colspan="3">罚球<br>(One Point)</th>
									<th rowspan="2">助攻<br>assist</th>
									<th rowspan="2">篮板<br>backboard</th>
									<th rowspan="2">抢断<br>steals</th>
									<th rowspan="2">失误<br>Turnover</th>
									<th rowspan="2">盖帽<br>Blockshot</th>
									<th rowspan="2">犯规<br>Foul</th>
									<th rowspan="2">总计得分<br>Total Point</th>
									<th rowspan="2">二分命中率<br>Two Point percent</th>
									<th rowspan="2">三分命中率<br>Three Point percent</th>
									<th rowspan="2">罚球命中率<br>One Point percent</th>
									<th rowspan="2">效率值<br>PER</th>
									<th rowspan="2">真实命中率<br>TS%</th>
								</tr>
								<tr>
									<th>出手<br>Shot</th>
									<th>命中<br>Shooting</th>
									<th>得分<br>point</th>
									<th>出手<br>Shot</th>
									<th>命中<br>Shooting</th>
									<th>得分<br>point</th>
									<th>出手<br>Shot</th>
									<th>命中<br>Shooting</th>
									<th>得分<br>point</th>
								</tr>
								<!-- Example row for player stats -->
								<tr v-for="(item,index) in pdfData.pdfHomePlayerList" :key="index">
									<td>{{item.playerNumber}}</td>
									<td>{{item.playerName}}</td>
									<td>{{item.allTwoPoint}}</td> <!-- 2分球 - 出手 -->
									<td>{{item.twoPoint}}</td> <!-- 2分球 - 命中 -->
									<td>{{item.twoPointScore}}</td> <!-- 2分球 - 得分 -->
									<td>{{item.allThreePoint}}</td> <!-- 3分球 - 出手 -->
									<td>{{item.threePoint}}</td> <!-- 3分球 - 命中 -->
									<td>{{item.threePointScore}}</td> <!-- 3分球 - 得分 -->
									<td>{{item.allPoint}}</td> <!-- 罚球 - 出手 -->
									<td>{{item.point}}</td> <!-- 罚球 - 命中 -->
									<td>{{item.pointScore}}</td> <!-- 罚球 - 得分 -->
									<td>{{item.assist}}</td> <!-- 助攻 -->
									<td>{{item.backboard}}</td> <!-- 篮板 -->
									<td>{{item.stral}}</td> <!-- 抢断 -->
									<td>{{item.mistake}}</td> <!-- 失误 -->
									<td>{{item.blockShot}}</td> <!-- 盖帽 -->
									<td>{{item.foul}}</td> <!-- 犯规 -->
									<td>{{item.score}}</td> <!-- 总计得分 -->
									<td>{{Math.ceil(item.twoPointRate*100)}}%</td> <!-- 二分命中率 -->
									<td>{{Math.ceil(item.threePointRate*100)}}%</td> <!-- 三分命中率 -->
									<td>{{Math.ceil(item.pointRate*100)}}%</td> <!-- 罚球命中率 -->
									<td>{{item.per}}</td> <!-- 效率值 -->
									<td>{{Math.ceil(item.rate*100)}}%</td> <!-- 真实命中率 -->
								</tr>
								<!-- Add more rows as needed -->
							</table>
						</view>
						<!-- 表格结束 -->
					</view>
				</view>

				<!-- 客球队 -->
				<view class="f24 mb40">
					<view class="wei mb10">比赛球队team(客): {{pdfData.awayTeamName}}</view>
					<view class="c6">
						<view class="mb10">队伍总得分:<text class="wei c0">{{pdfData.awayScore}}</text></view>
						<view class="f-s-c mb10">
							<view class="mr20">第一节:<text class="wei c0">{{pdfData.awayOneScore}}</text></view>
							<view class="mr20">第二节:<text class="wei c0">{{pdfData.awayTwoScore}}</text></view>
							<view class="mr20">第三节:<text class="wei c0">{{pdfData.awayThreeScore}}</text></view>
							<view class="mr20">第四节:<text class="wei c0">{{pdfData.awayFourScore}}</text></view>
							<view class="mr20">第五节:<text class="wei c0">{{pdfData.awayFiveScore}}</text></view>
							<view class="mr20">第六节:<text class="wei c0">{{pdfData.awaySixScore}}</text></view>
							<view class="mr20">第七节:<text class="wei c0">{{pdfData.awaySevenScore}}</text></view>
						</view>
						<view class="f-s-c mb10">
							<view class="mr20">
								<view class="">第一节团队犯规:<text class="wei c0">{{pdfData.awayTeamOneFoul}}</text></view>
								<view class="t-r">团队暂停:<text class="wei c0">{{pdfData.awayTeamOneStop}}</text></view>
							</view>
							<view class="mr20">
								<view class="">第二节团队犯规:<text class="wei c0">{{pdfData.awayTeamTwoFoul}}</text></view>
								<view class="t-r">团队暂停:<text class="wei c0">{{pdfData.awayTeamTwoStop}}</text></view>
							</view>
							<view class="mr20">
								<view class="">第三节团队犯规:<text class="wei c0">{{pdfData.awayTeamThreeFoul}}</text></view>
								<view class="t-r">团队暂停:<text class="wei c0">{{pdfData.awayTeamThreeStop}}</text></view>
							</view>
							<view class="mr20">
								<view class="">第四节团队犯规:<text class="wei c0">{{pdfData.awayTeamFourFoul}}</text></view>
								<view class="t-r">团队暂停:<text class="wei c0">{{pdfData.awayTeamFourStop}}</text></view>
							</view>
						</view>
						<!-- 表格开始 -->
						<view class="table-container">
							<table class="stats-table">
								<tr>
									<th rowspan="2">号码<br>(number)</th>
									<th rowspan="2">球员<br>(player)</th>
									<th colspan="3">2分球<br>(Two Point)</th>
									<th colspan="3">3分球<br>(Three Point)</th>
									<th colspan="3">罚球<br>(One Point)</th>
									<th rowspan="2">助攻<br>assist</th>
									<th rowspan="2">篮板<br>backboard</th>
									<th rowspan="2">抢断<br>steals</th>
									<th rowspan="2">失误<br>Turnover</th>
									<th rowspan="2">盖帽<br>Blockshot</th>
									<th rowspan="2">犯规<br>Foul</th>
									<th rowspan="2">总计得分<br>Total Point</th>
									<th rowspan="2">二分命中率<br>Two Point percent</th>
									<th rowspan="2">三分命中率<br>Three Point percent</th>
									<th rowspan="2">罚球命中率<br>One Point percent</th>
									<th rowspan="2">效率值<br>PER</th>
									<th rowspan="2">真实命中率<br>TS%</th>
								</tr>
								<tr>
									<th>出手<br>Shot</th>
									<th>命中<br>Shooting</th>
									<th>得分<br>point</th>
									<th>出手<br>Shot</th>
									<th>命中<br>Shooting</th>
									<th>得分<br>point</th>
									<th>出手<br>Shot</th>
									<th>命中<br>Shooting</th>
									<th>得分<br>point</th>
								</tr>
								<!-- Example row for player stats -->
								<tr v-for="(item,index) in pdfData.pdfAwayPlayerList" :key="index">
									<td>{{item.playerNumber}}</td>
									<td>{{item.playerName}}</td>
									<td>{{item.allTwoPoint}}</td> <!-- 2分球 - 出手 -->
									<td>{{item.twoPoint}}</td> <!-- 2分球 - 命中 -->
									<td>{{item.twoPointScore}}</td> <!-- 2分球 - 得分 -->
									<td>{{item.allThreePoint}}</td> <!-- 3分球 - 出手 -->
									<td>{{item.threePoint}}</td> <!-- 3分球 - 命中 -->
									<td>{{item.threePointScore}}</td> <!-- 3分球 - 得分 -->
									<td>{{item.allPoint}}</td> <!-- 罚球 - 出手 -->
									<td>{{item.point}}</td> <!-- 罚球 - 命中 -->
									<td>{{item.pointScore}}</td> <!-- 罚球 - 得分 -->
									<td>{{item.assist}}</td> <!-- 助攻 -->
									<td>{{item.backboard}}</td> <!-- 篮板 -->
									<td>{{item.stral}}</td> <!-- 抢断 -->
									<td>{{item.mistake}}</td> <!-- 失误 -->
									<td>{{item.blockShot}}</td> <!-- 盖帽 -->
									<td>{{item.foul}}</td> <!-- 犯规 -->
									<td>{{item.score}}</td> <!-- 总计得分 -->
									<td>{{Math.ceil(item.twoPointRate*100)}}%</td> <!-- 二分命中率 -->
									<td>{{Math.ceil(item.threePointRate*100)}}%</td> <!-- 三分命中率 -->
									<td>{{Math.ceil(item.pointRate*100)}}%</td> <!-- 罚球命中率 -->
									<td>{{item.per}}</td> <!-- 效率值 -->
									<td>{{Math.ceil(item.rate*100)}}%</td> <!-- 真实命中率 -->
								</tr>
								<!-- Add more rows as needed -->
							</table>
						</view>
						<!-- 表格结束 -->
					</view>
				</view>
				<view class="t-c" style="margin: 0 auto;padding-left: 200rpx;">
					<text class="wei f24" style="margin-right: 200rpx;">技术代表:</text>
					<text class="wei f24" style="margin-right: 200rpx;">主裁判员:</text>
					<text class="wei f24" style="margin-right: 200rpx;">副裁判员1:</text>
					<text class="wei f24" style="margin-right: 200rpx;">副裁判员2:</text>
					<text class="wei f24" style="margin-right: 100rpx;">球队申诉签名:</text>
				</view>
				<view class="wei mb10 f24 mt30">时间(time): {{pdfData.tournamentBeginTime}}</view>
				<view class="wei mb10 f24">地点(locality): {{pdfData.address}}</view>
			</view>
			<view class="f-s-c p2">
				<view class="btn-primary mt20 bs16 mb20" style="width: 45%;height: 60rpx;margin: 0 auto;"
					@click="submitExport">
					导出PDF
				</view>
				<view class="be7 f-c mt20 bs16 mb20" style="width: 45%;height: 60rpx;margin: 0 auto;" @click="cancel">
					取消
				</view>
			</view>
		</uni-popup>

		<uni-popup ref="popup3" type="bottom" background-color="#fff" :mask-click="false">
			<view class="moreData">
				<view class="top-title" @click="closeMore">
					<view style="color: #999;font-size: 24rpx;">{{ name }}-全面数据</view>
					<view class="icon">X</view>
				</view>
				<view class="more-content">
					<view class="more-all">
						<view class="more-tab" :class="moreIndex==index? 'moreActive':''"
							v-for="(item,index) in moreTabList" :key="index" @click="moreTabClick(index,item)">
							{{item.name}}
						</view>
					</view>
					<view class="more-all-second">
						<view class="more-second-tab" :class="moreSecondIndex==index? 'moreSecondActive':''"
							v-for="(item,index) in moreSecondTabList" :key="index" @click="moreTabSecondClick(index)">
							{{item}}
						</view>
					</view>
					<view class="compare2">
						<view class="compare-title2"> {{moreTabList[moreIndex].name}} </view>
						<view class="compare-vs">
							<view class="t-name">{{keyFiguresData.teamOneName}}</view>
							<view>VS</view>
							<view class="t-name">{{keyFiguresData.teamTwoName}}</view>
						</view>
						<view class="compare-score2">
							<view class="line-tame">
								<image v-if="keyFiguresData.teamOneLogo" :src="keyFiguresData.teamOneLogo"
									mode="widthFix"></image>
								<image v-else src="@/static/images/logo.jpg" mode="widthFix"></image>
								<view class="t-number">{{ keyFiguresData.teamOneScore }}</view>
							</view>
							<view class="line-box">
								<view class="line">
									<view class="active" :style="{
						  width: getPice(keyFiguresData.teamOneScore, keyFiguresData.teamOneScore + keyFiguresData.teamTwoScore),
						}">
									</view>
								</view>
								<view class="line">
									<view class="active2" :style="{
						  width: getPice(keyFiguresData.teamTwoScore, keyFiguresData.teamOneScore + keyFiguresData.teamTwoScore),
						}">
									</view>
								</view>
							</view>
							<view class="line-tame">
								<image v-if="keyFiguresData.teamTwoLogo" :src="keyFiguresData.teamTwoLogo"
									mode="widthFix"></image>
								<image v-else src="@/static/images/logo.jpg" mode="widthFix"></image>
								<view class="t-number">{{ keyFiguresData.teamTwoScore }}</view>
							</view>
						</view>
					</view>
					<view class="t-bottom">
						<view class="t-item">
							<!-- <view class="t-item-top">
								<text>首发：79</text>
								<text>替补：79</text>
							</view> -->
							<view class="t-item-content" v-for="item in keyFiguresData.teamOneDataList">
								<view class="t-item-content-left">{{item.playerName}}</view>
								<view class="t-item-content-right">{{item.num}}</view>
							</view>
						</view>
						<view class="t-item" style="text-align: right;">
							<view class="t-item-content" v-for="item in keyFiguresData.teamTwoDataList">
								<view class="t-item-content-left">{{item.playerName}}</view>
								<view class="t-item-content-right">{{item.num}}</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</uni-popup>
		<!-- 全面分析弹窗 -->
		<uni-popup ref="popup5" type="bottom" background-color="#fff" :mask-click="false">
			<view class="moreData">
				<view class="top-title" @click="closepkMore">
					<view style="color: #999;font-size: 24rpx;">球员PK-全面分析</view>
					<view class="icon">X</view>
				</view>
				<view class="more-content">
					<view class="more-all-second">
						<view class="more-second-tab" :class="morePkIndex==index? 'moreSecondActive':''"
							v-for="(item,index) in moreSecondTabList" :key="index" @click="morePkClick(index)">
							{{item}}
						</view>
					</view>
					<view class="playerPk" style="padding: 32rpx 0;">
						<view class="p-1" @click="onchangePlayer(1)">
							<image class="playerImage" src="@/static/images/baskerballer.png"></image>
							<view class="playerTitle">
								<text>{{pkUser1}}</text>
								<image src="@/static/images/qiehuan.png"></image>
							</view>
						</view>
						<view class="p-2">
							<!-- 得分 篮板 助攻 投篮 效率值 -->
							<view class="p-2-item">
								<view class="p-2-left" :class="pkDataOne.score>pkDataTwo.score?'colorActive1':''">
									{{pkDataOne.score}}
								</view>
								<view class="p-2-center">得分</view>
								<view class="p-2-right" :class="pkDataOne.score<pkDataTwo.score?'colorActive2':''">
									{{pkDataTwo.score}}
								</view>
							</view>
							<view class="p-2-item">
								<view class="p-2-left"
									:class="pkDataOne.backboard>pkDataTwo.backboard?'colorActive1':''">
									{{pkDataOne.backboard}}
								</view>
								<view class="p-2-center">篮板</view>
								<view class="p-2-right"
									:class="pkDataOne.backboard<pkDataTwo.backboard?'colorActive2':''">
									{{pkDataTwo.backboard}}
								</view>
							</view>
							<view class="p-2-item">
								<view class="p-2-left" :class="pkDataOne.assist>pkDataTwo.assist?'colorActive1':''">
									{{pkDataOne.assist}}
								</view>
								<view class="p-2-center">助攻</view>
								<view class="p-2-right" :class="pkDataOne.assist<pkDataTwo.assist?'colorActive2':''">
									{{pkDataTwo.assist}}
								</view>
							</view>
							<view class="p-2-item">
								<view class="p-2-left colorActive1">
									{{pkDataOne.shootPointNum}}/{{pkDataOne.shootTotalNum}}
								</view>
								<view class="p-2-center">投篮</view>
								<view class="p-2-right colorActive2">
									{{pkDataTwo.shootPointNum}}/{{pkDataTwo.shootTotalNum}}
								</view>
							</view>
							<view class="p-2-item" v-if="morePkIndex==4">
								<view class="p-2-left" :class="pkDataOne.per>pkDataTwo.per?'colorActive1':''">
									{{pkDataOne.per}}
								</view>
								<view class="p-2-center">+/-</view>
								<view class="p-2-right" :class="pkDataOne.per<pkDataTwo.per?'colorActive2':''">
									{{pkDataTwo.per}}
								</view>
							</view>
						</view>
						<view class="p-1" @click="onchangePlayer(2)">
							<image class="playerImage" src="@/static/images/baskerballer.png"
								style="transform: scaleX(-1) !important;"></image>
							<view class="playerTitle">
								<text>{{pkUser2}}</text>
								<image src="@/static/images/qiehuan.png"></image>
							</view>
						</view>
					</view>
					<view class="compare2" style="padding: 0 32rpx;">
						<!-- 抢断 失误 盖帽 犯规 二分命中率 三分命中率 罚球命中率 真实命中率 -->
						<view class="ck-item" v-for="item in fieldList" :key="item.field">
							<view class="compare-title"> {{item.title}} </view>
							<view class="compare-score3">
								<view
									v-if="['twoPointRate', 'threePointRate', 'pointRate', 'rate'].includes(item.field)">
									{{ parseInt(pkDataOne[item.field]*100) > 100 ? 100 : parseInt(pkDataOne[item.field]*100) }}%
								</view>
								<view v-else>{{ pkDataOne[item.field] }}</view>
								<view class="line-box">
									<view class="line">
										<view class="active" :style="{
							  width: getPice(pkDataOne[item.field], pkDataOne[item.field] + pkDataTwo[item.field])
							}">
										</view>
									</view>
									<view class="line">
										<view class="active2" :style="{
											width: getPice(pkDataTwo[item.field], pkDataOne[item.field] + pkDataTwo[item.field])
							}">
										</view>
									</view>
								</view>
								<view
									v-if="['twoPointRate', 'threePointRate', 'pointRate', 'rate'].includes(item.field)">
									{{ parseInt(pkDataTwo[item.field]*100) > 100 ? 100 : parseInt(pkDataTwo[item.field]*100) }}%
								</view>
								<view v-else>{{ pkDataTwo[item.field] }}</view>
							</view>
						</view>
						<!-- <view class="ck-item">
							<view class="compare-title"> 失误 </view>
							<view class="compare-score3">
								<view>{{ pkDataOne.mistake }}</view>
								<view class="line-box">
									<view class="line">
										<view class="active" :style="{
							  width: getPice(pkDataOne.mistake, pkDataOne.mistake + pkDataTwo.mistake)
							}">
										</view>
									</view>
									<view class="line">
										<view class="active2" :style="{
											width: getPice(pkDataTwo.mistake, pkDataOne.mistake + pkDataTwo.mistake)
							}">
										</view>
									</view>
								</view>
								<view>{{ pkDataTwo.mistake }}</view>
							</view>
						</view> -->
					</view>
					<view class="t-bottom">
						<view class="t-item">
							<!-- <view class="t-item-top">
								<text>首发：79</text>
								<text>替补：79</text>
							</view> -->
							<view class="t-item-content" v-for="item in keyFiguresData.teamOneDataList">
								<view class="t-item-content-left">{{item.playerName}}</view>
								<view class="t-item-content-right">{{item.num}}</view>
							</view>
						</view>
						<view class="t-item" style="text-align: right;">
							<view class="t-item-content" v-for="item in keyFiguresData.teamTwoDataList">
								<view class="t-item-content-left">{{item.playerName}}</view>
								<view class="t-item-content-right">{{item.num}}</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</uni-popup>
		<!-- 切换球员弹窗 -->
		<uni-popup ref="popup4" type="bottom" background-color="#fff" :mask-click="false">
			<view class="moreData">
				<view class="top-title" @click="$refs.popup4.close()">
					<view style="color: #999;font-size: 24rpx;">选择球员</view>
					<view class="icon">X</view>
				</view>
				<view class="pkContent">
					<view class="pk-left">
						<view class="pk-title2" style="margin-left: 10rpx;">{{info.teamOneName}}</view>
						<view class="pk-item" @click="selectPlayerSure(item,1)"
							v-for="(item,index) in oneTeamScoreList.slice(0,oneTeamScoreList.length-1)" :key="index">
							{{item.code}} / {{item.name}}
						</view>
					</view>
					<view class="pk-right">
						<view class="pk-title2" style="margin-left: 40rpx;">{{info.teamTwoName}}</view>
						<view class="pk-item" style="margin-left: 40rpx;" @click="selectPlayerSure(item,2)"
							v-for="(item,index) in twoTeamScoreList.slice(0,twoTeamScoreList.length-1)" :key="index">
							{{item.code}} / {{item.name}}
						</view>
					</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import LineChart from "@/components/LineChart.vue";
	import html2Canvas from 'html2canvas'
	import jsPDF from 'jspdf';
	// import {
	// 	jsPDF
	// } from 'jspdf'
	import {
		getToken
	} from '@/utils/auth'
	import config from "@/config";
	import "@/static/jswebrtc.min.js";
	import countUp from "@/components/countUp.vue";
	import {
		imageUrl
	} from "@/config.js";
	import axios from "axios";
	import Cookies from "js-cookie";
	import upload from '@/utils/upload'
	import {
		getLeagueH5League,
		getLeagueH5TeamCompare,
		getLeagueH5LiveBegin,
		getLeagueH5PlayerLogList,
		getLeagueH5playerLogdownBox,
		getLeagueH5GetSummary,
		getLeagueH5BestOfTheGame,
		getLeagueH5RealTimeData,
		getLeagueH5RealTimeDataTeam,
		getScore,
		getlivePlayer,
		getleague,
		setliveNum,
		getlivetournamentPlayList,
		getPdfData,
		getsignature,
		getLogo,
		getScoreMovement,
		getKeyFigures,
		getKeyFiguresEnums,
		getPlayerPK,
		getPlayerList,
		getLeagueH5RankingList,
		getLeagueH5AverageComparison,
		getLeagueH5SeasonComparison
	} from "@/api/tournament/index.js";
	import {
		sendChat,
		getChat,
		getAccessTokenNew,
		getUserInfoNew,
	} from "../api/tournament";
	import {
		formatDate
	} from "../utils/common";
	import {
		wexinShare
	} from "@/common/js/utils.js";
	export default {
		components: {
			countUp,
			LineChart,
		},
		data() {
			return {
				videoScoreStyle: {
					top: '100px',
					left: '100px'
				},
				isExport: false,
				pdfData: '',
				accessToken: "",
				tab: 0,
				info: {},
				msg: "",
				playerLogList: [],
				goodList: [],
				oneTeamList: [],
				twoTeamList: [],
				oneTeamScoreList: [],
				oneTeamTotalScoreList: [],
				twoTeamScoreList: [],
				twoTeamTotalScoreList: [],
				titleList: [],
				twoTeam: {},
				oneTeam: {},
				videoSrc: "",
				videos: "",
				isvideo: false,
				player: "",
				oneNum: 0,
				twoNum: 0,
				subsection: 0,
				time: "",
				contestName: "",
				teamOneName: "",
				teamTwoName: "",
				contestId: "",
				liveList: [],
				qList: [],
				qList1: [],
				teamSubsectionScoreSumTotal2: 0,
				teamSubsectionScoreSumTotal1: 0,
				name: "",
				isBack: false,
				imgUrl: "",
				sercerImage: imageUrl,
				liveNum: 0,
				playerLiveList: [],
				playerList: {},
				playerId: "",
				isLoggedIn: false,
				userInfo: {},
				newMessage: "",
				lastFetchDate: undefined,
				messages: [],
				userid: "",
				lastInteractionTime: 0,
				scrollInterval: null,
				messagesInterval: null,
				appID: "wx436121832ee5741d",
				appSecret: "ebca938819d292310000513443a647bc",
				loginBtn: true,
				isIng: -1,
				scoringWay: 0,
				scoreObj: '',
				isMobile: '', //判断是否移动端
				logoData: '',
				isFullscreen: false, // 是否全屏
				//新改
				tabsTeamIndex: 0,
				tabsIndex: 0,
				scoreData: '',
				keyFiguresData: '',
				lineChartShow: false,
				moreTabList: [
					'得分', '篮板', '抢断'
				],
				moreIndex: 0,
				moreSecondTabList: [
					'1ST', '2ND', '3RD', '4TH', '全场'
				],
				moreSecondIndex: 4, ///
				keyType: 1,
				keyPlayerType: 1,
				key_subsection: 0,
				teamIndex: 0,
				//
				pkTabIndex: 0,
				morePkIndex: 4, ////
				pk_subsection: '',
				// playerId: 1,
				pk_Type: 1,
				pkIndex: 1,
				pkPlayId: '',
				pkDataOne: '',
				pkDataTwo: '',
				pkUser1: '',
				pkUser2: '',
				fieldList: [{
						title: '抢断',
						field: 'stral'
					},
					{
						title: '失误',
						field: 'mistake'
					},
					{
						title: '盖帽',
						field: 'blockShot'
					}, //
					{
						title: '犯规',
						field: 'foul'
					},
					{
						title: '二分命中率',
						field: 'twoPointRate'
					},
					{
						title: '三分命中率',
						field: 'threePointRate'
					},
					{
						title: '罚球命中率',
						field: 'pointRate'
					},
					{
						title: '真实命中率',
						field: 'rate'
					},
				],
				//
				rankType: 1,
				rankingList: [],
				moreRankIndex: 0,
				moreRankTabList: [
					'得分', '三分', '篮板', '助攻', '抢断', '盖帽'
				],
				//
				leftValue: 0,
				isScrolling: false // 防抖标志
			};
		},
		onLoad(option) {
			this.id = option.id;
			this.contestId = option.contestId;
			this.name = option.name;
			this.imgUrl = option.img;
			this.getInfo();
			// this.getPKInfo()
			// this.getApiPlayerList()
			this.getLogoFn()
			this.imageUrl = config.imageUrl;
			window.addEventListener(
				"popstate",
				() => {
					clearInterval(this.time);
				},
				false
			);
			this._getlivetournamentPlayList();
			this.scoringWay = uni.getStorageSync("scoringWay");

			// 获取系统信息
			const systemInfo = uni.getSystemInfoSync();
			// 判断是否是移动端
			// const isMobile = /android|iphone|ipad|ipod/.test(systemInfo.platform.toLowerCase());
			// if (isMobile) {
			// 	uni.showToast({
			// 		title: '当前设备是移动端',
			// 		icon: 'none'
			// 	})
			// } else {
			// 	uni.showToast({
			// 		title: '当前设备是媒体PC端',
			// 		icon: 'none'
			// 	})
			// }
			// this.isMobile = isMobile
		},
		onBackButtonEvent() {
			console.log("1");
		},
		async mounted() {
			this.getUserOpenid();
			console.log("组件挂载中...");
			if (await this.isIngCompare()) {
				console.log("正在比较...");
				this.getMessagesList();
				this.getwxCode();
				this.handleTabUrl();
			} else {
				console.log("没有进行比较，调用getMessagesList...");
				this.getMessagesList();
				this.handleTabUrl();
			}
		},
		beforeDestroy() {
			// 在组件销毁前移除事件监听器
			const chatRoom = this.$refs.chatRoom;
			chatRoom.removeEventListener("click", this.handleChatRoomClick);
			chatRoom.removeEventListener("touchstart", this.handleChatRoomTouchStart);
			chatRoom.removeEventListener("touchend", this.handleChatRoomTouchEnd);
			// 清理定时器
			// console.log("清理一开始")
			// console.log('清理', this.messagesInterval)
			clearInterval(this.scrollInterval);
			clearInterval(this.messagesInterval);
			// console.log("清理一结束")
			sessionStorage.removeItem("special_index");
			// localStorage.removeItem('special_index');
		},
		computed: {
			teamTitle() {
				return this.tabsTeamIndex == 0 ? '球队' : this.tabsTeamIndex == 1 ? '场均' : '赛季'
			}
		},
		methods: {
			handleScroll1(e) {
				if (this.isScrolling) return
				this.isScrolling = true
				this.leftValue = e.detail.scrollLeft
				this.$nextTick(() => {
					this.isScrolling = false
				})
			},
			handleScroll2(e) {
				if (this.isScrolling) return
				this.isScrolling = true
				this.leftValue = e.detail.scrollLeft
				this.$nextTick(() => {
					this.isScrolling = false
				})
			},
			//排行榜数据
			_getLeagueH5RankingList() {
				getLeagueH5RankingList({
					contestId: this.contestId,
					type: this.rankType,
				}).then((res) => {
					this.rankingList = res.slice(0, 4);
				});
			},
			goRank() {
				uni.navigateTo({
					url: '/pages/index?id=' + this.contestId + '&name=' + this.logoData.contestName + '&img=' + (
						this
						.logoData.contestLogo ? this.logoData.contestLogo : '') + '&pageSource=球员PK排行榜'
				})
			},
			closepkMore() {
				this.$refs.popup5.close()
				this.pk_Type = 1
				// this.pk_subsection = ''
				this.getPKInfo(this.pkPlayId, this.pkIndex)
			},
			goFenxi() {
				this.pk_Type = 2
				this.getPKInfo(this.pkPlayId, this.pkIndex)
				this.$refs.popup5.open()
			},
			morePkClick(index) {
				// this.pk_Type = 2
				this.pk_subsection = index + 1
				this.morePkIndex = index
				this.getPKInfo(this.pkPlayId, this.pkIndex)
			},
			onchangePlayer(index) {
				console.log('1231231231231')
				this.$refs.popup4.open()
				this.pkIndex = index
			},
			selectPlayerSure(item, sindex) {
				if (this.pkUser1 == item.name || this.pkUser2 == item.name) {
					uni.showToast({
						title: "请不要选择相同球员PK!",
						icon: "none",
					});
					return
				}
				this.getPKInfo(item.basketballPlayerId, this.pkIndex)
				this.$refs.popup4.close()
				if (this.pkIndex == 1) {
					this.pkUser1 = item.name
				}
				if (this.pkIndex == 2) {
					this.pkUser2 = item.name
				}
			},
			moreTabClick(index, item) {
				this.moreIndex = index
				this.keyPlayerType = item.id
				this.getKeyData()
			},
			moreTabSecondClick(index) {
				this.moreSecondIndex = index
				this.key_subsection = index + 1
				this.getKeyData()
			},
			goMore() {
				//获取更多数据弹窗顶部的tab栏
				getKeyFiguresEnums({
					"tournamentId": this.id,
				}).then(res => {
					this.moreTabList = res.data
				})
				//
				this.$refs.popup3.open()
				this.keyType = 2
				this.getKeyData()
			},
			closeMore() {
				this.$refs.popup3.close()
				this.keyType = 1
				// this.keyPlayerType = item.id
				this.getKeyData()
			},
			moreTabRankClick(index) {
				this.moreRankIndex = index
				this.rankType = index + 1
				this._getLeagueH5RankingList()
			},
			async tabClick(index) {
				this.tabsIndex = index
				if (index == 1) {
					// 比分走势
					this.lineChartShow = false
					try {
						const res = await getScoreMovement({
							tournamentId: this.id
						});
						this.scoreData = res.data
						this.lineChartShow = true;
					} catch (error) {
						this.lineChartShow = true;
					}
				}
				if (index == 2) {
					// 关键数据
					this.keyType = 1
					this.keyPlayerType = 1
					this.getKeyData()
				}
			},
			ongetCanvas() {
				uni.navigateTo({
					url: "/pages/getCanvas?id=" + this.id
				});
			},
			async tabTeamClick(index) {
				this.tabsTeamIndex = index
				if (index == 0) {
					this._getLeagueH5TeamCompare();
				}
				if (index == 1) {
					// 场均对比
					getLeagueH5AverageComparison({
						tournamentId: this.id,
					}).then((res) => {
						this.oneTeam = res.data.oneTeam;
						this.twoTeam = res.data.twoTeam;
					});
				}
				if (index == 2) {
					// 赛季对比
					getLeagueH5SeasonComparison({
						tournamentId: this.id,
					}).then((res) => {
						this.oneTeam = res.data.oneTeam;
						this.twoTeam = res.data.twoTeam;
					});
				}
			},
			getKeyData() {
				let section = !this.key_subsection ? null : this.key_subsection == 0 ? 1 : this.key_subsection == 5 ?
					null : this.key_subsection
				getKeyFigures({
					"tournamentId": this.id,
					"type": this.keyType,
					"subsection": section,
					"playerType": this.keyPlayerType,
				}).then(res => {
					this.keyFiguresData = res.data
				})
			},
			// 监听全屏切换事件
			onFullscreenChange(e) {
				// H5 全屏状态检测
				const isFullscreen = !!(
					document.fullscreenElement ||
					document.webkitFullscreenElement ||
					document.mozFullScreenElement ||
					document.msFullscreenElement
				);
				this.isFullscreen = isFullscreen;
				var that = this;
				if (this.isFullscreen) {
					// this.$nextTick(() => {
					// 	that.videoScoreStyle = {
					// 		bottom: '20px'
					// 	}
					// })
					this.$nextTick(() => {
						// let view = uni.createSelectorQuery().in(this).select("#jswebrtc");
						let bifen = uni.createSelectorQuery().in(that).select(".bifen");
						// view.boundingClientRect((videoStyle) => {
						bifen.boundingClientRect((bifenStyle) => {
							that.videoScoreStyle = {
								bottom: '20px',
								width: '50%',
								left: '25%'
							}
						}).exec();
						// }).exec();
					})
				} else {
					that.$nextTick(() => {
						let view = uni.createSelectorQuery().in(that).select("#jswebrtc");
						let bifen = uni.createSelectorQuery().in(that).select(".bifen");
						view.boundingClientRect((videoStyle) => {
							bifen.boundingClientRect((bifenStyle) => {
								that.videoScoreStyle = {
									top: videoStyle.height - bifenStyle.height - 20 + 'px'
								}
							}).exec();
						}).exec();
					})
				}


			},
			share() {
				const isIOS = function() {
					var isIphone = navigator.userAgent.includes('iPhone')
					var isIpad = navigator.userAgent.includes('iPad')
					return isIphone || isIpad
				}
				if (!window.entryUrl) {
					window.entryUrl = encodeURIComponent(location.href.split('#')[0])
				}
				// let currentUrl = location.href //获取当前页面链接
				//获取url链接（如果有#需要这么获取）
				var currentUrl = encodeURIComponent(window.location.href.split('#')[0])
				// var currentUrl = isIOS() ? window.entryUrl : encodeURIComponent(window.location.href.split('#')[0])
				//获取url链接（如果没有#需要这么获取）
				// var currentUrl = encodeURIComponent(window.location.href);
				console.log('currentUrl', currentUrl);
				getsignature({
					url: currentUrl
				}).then((res) => {
					console.log('res数据', res);
					if (res.code == 200) {
						//获取的微信加签
						let obj = {
							appId: res.data.appId,
							nonceStr: res.data.nonceStr,
							signature: res.data.signature,
							timestamp: res.data.timestamp,
						};
						const title = this.info.tournamentBeginTime + '  ' + this.info.teamOneName + ' vs ' + this
							.info.teamTwoName
						//分享的内容
						let shareData = {
							// title: this.name,
							// desc: this.name,
							title: title,
							desc: title,
							link: location.href,
							// imgUrl: "https://boyubasketball.oss-cn-shanghai.aliyuncs.com/17316574783461731656407-compressed-IMG_4036.PNG",
							imgUrl: this.imageUrl + this.imgUrl,
						};
						const metaImage = document.createElement('meta');
						metaImage.setAttribute('property', 'og:image');
						metaImage.setAttribute('content', this.imageUrl + this.imgUrl);
						document.head.appendChild(metaImage);

						const metaTitle = document.createElement('meta');
						metaTitle.setAttribute('property', 'og:title');
						metaTitle.setAttribute('content', title);
						document.head.appendChild(metaTitle);

						const metaDescription = document.createElement('meta');
						metaDescription.setAttribute('property', 'og:description');
						metaDescription.setAttribute('content', title);
						document.head.appendChild(metaDescription);
						//调用封装好的方法，传入微信加签和内容
						wexinShare(obj, shareData);
					} else {
						uni.showToast({
							title: "获取sdk参数失败!",
							icon: "none",
						});
					}
				});
			},
			getPdf() {
				this.isExport = false
				this.$refs.popup2.open()
				getPdfData({
					tournamentId: this.id //1494 //
				}).then(res => {
					this.pdfData = res.data
				})
			},
			cancel() {
				this.isExport = !this.isExport;
				this.$refs.popup2.close()
			},
			submitExport() {
				this.isExport = true
				this.$refs.popup2.close() //关闭弹窗
				uni.showLoading({
					title: '正在导出中...',
				})
				setTimeout(() => {

					let that = this
					var shareContent = document.getElementById('content2'); //需要截图的包裹的（原生的）DOM 对象

					var rect = shareContent.getBoundingClientRect();
					var width = rect.width; // 获取dom 宽度
					var height = rect.height; // 获取dom 高度
					var canvas = document.createElement("canvas"); //创建一个canvas节点
					var scale = 1; //定义任意放大倍数 支持小数
					canvas.width = width * scale; //定义canvas 宽度 * 缩放
					canvas.height = height * scale; //定义canvas高度 *缩放
					var ctx = canvas.getContext("2d"); // 获取context
					ctx.scale(scale, scale); // 设置scale
					ctx.fillStyle = "#fff"; // 设置填充样式为白色
					ctx.fillRect(0, 0, canvas.width, canvas.height); // 画出白色背景
					var opts = {
						scale: scale, // 添加的scale 参数
						canvas: canvas, //自定义 canvas
						logging: true, //日志开关
						width: width, //dom 原始宽度
						height: height, //dom 原始高度
						backgroundColor: '#fff',
					};
					html2Canvas(shareContent, opts).then(function(canvas) {
						var pageData = canvas.toDataURL('image/png', 1.0);
						that.parseBlob(pageData)
						// uni.previewImage({
						// 	urls: [pageData]
						// })
					})

				}, 100)
			},
			async parseBlob(base64) {
				const base64Data = base64.split(',')[1];

				// 将 Base64 数据转换为 Blob
				const blob = await this.b64toBlob(base64Data, 'image/png');

				// 创建一个临时的文件对象
				const blobPath = URL.createObjectURL(blob);
				let that = this
				uni.uploadFile({
					url: config.baseUrl + '/system/h5/basketballTeam/downloadPdf',
					filePath: blobPath, //有效
					name: 'file',
					formData: {
						'filename': that.name + '技术统计表' + '.pdf',
					},
					success: (resData) => {
						console.log('resDataresData')
						console.log(resData)
						let pdfUrl = config.imageUrl + JSON.parse(resData.data).msg
						console.log('pdfUrl', pdfUrl)
						uni.hideLoading()
						let ua = navigator.userAgent.toLowerCase();
						if (ua.match(/MicroMessenger/i) == "micromessenger") {
							//是

							uni.showModal({
								title: "导出成功",
								content: "下载PDF文件请从浏览器右上角打开分享文件",
								showCancel: false,
								success: (res) => {
									if (res.confirm) {
										// 下载pdf
										let link = document.createElement("a");
										link.href = pdfUrl;
										link.style.display = "none"; //a标签隐藏
										link.download = `${that.name+'技术统计表'}.pdf`;
										document.body.appendChild(link);
										link.click();
										document.body.removeChild(link)
									}
								}
							})

						} else {
							//不是

							uni.showToast({
								title: '导出成功',
								icon: 'none'
							})
							// 下载pdf
							let link = document.createElement("a");
							link.href = pdfUrl;
							link.style.display = "none"; //a标签隐藏
							link.download = `${that.name+'技术统计表'}.pdf`;
							document.body.appendChild(link);
							link.click();
							document.body.removeChild(link)

						}


					},
					fail: (res) => {
						console.log(res)
					}
				});
			},
			_getlivetournamentPlayList() {
				getlivetournamentPlayList({
					tournamentId: this.id
				}).then((res) => {
					this.playerList = res;
					this.playerId = this.playerList.oneTeam.baseBasketballPlayersList[0].id;
					this._getlivePlayer();
				});
			},
			changePlayer(id) {
				// this.liveList= []
				this.playerId = id;
				this._getlivePlayer();
			},
			_getlivePlayer() {
				console.log(
					this.playerList.oneTeam.baseBasketballPlayersList[0].id,
					"[---this.playerList.oneTeam.baseBasketballPlayersList[0].id]"
				);
				getlivePlayer({
					tournamentId: this.id,
					playId: this.playerId ||
						this.playerList.oneTeam.baseBasketballPlayersList[0].id,
				}).then((res) => {
					console.log(this.playerLiveList, "-----this.-----");
					// this.playerLiveList = res.rows;
					this.liveList = res.rows;
				});
			},
			getPice(one, all) {
				let widthNum = (one / all) * 100;
				return widthNum + "%";
			},
			getZeroScore(num) {
				let widthNum = num
				if (num <= 9) {
					widthNum = '0' + (num || '')
				}
				return widthNum;
			},
			getfen(code, list) {
				let data = list.find((item) => item.type == code);
				if (data) {
					return [90, 91, 92, 93, 95].includes(code) ?
						`${data.typeCount ? (data.typeCount * 100).toFixed(0) + "%" : 0}` :
						data.typeCount;
				} else {
					return 0;
				}
			},
			changeTab(tab) {
				this.tab = tab;
				console.log("state", this.info.state, "tab", this.tab);
				if (this.tab !== 4) {
					// clearInterval(this.messagesInterval);
					clearInterval(this.scrollInterval);
					sessionStorage.removeItem("special_index");
				}

				if (this.tab == 1) {
					this._getLeagueH5PlayerLogList();
					this._getLeagueH5GetSummary();
				} else if (this.tab == 2) {
					this._getLeagueH5BestOfTheGame();
					this._getLeagueH5RealTimeData();
					this._getLeagueH5RealTimeDataTeam();
					this._getLeagueH5playerLogdownBox();
					this._getLeagueH5TeamCompare();
					this._getLeagueH5RealTimeDataTeam2();
				} else if (this.tab == 4) {
					// this.fetchMessages();
					// 获取 chat-room 的 DOM 元素
					sessionStorage.setItem("special_index", 4);
					// localStorage.setItem('special_index', 4);
					const chatRoom = this.$refs.chatRoom;
					// 添加点击事件监听器
					chatRoom.addEventListener("click", this.handleChatRoomClick);
					// 添加触屏开始事件监听器
					chatRoom.addEventListener("touchstart", this.handleChatRoomTouchStart);
					// 添加触屏结束事件监听器
					chatRoom.addEventListener("touchend", this.handleChatRoomTouchEnd);
					// 开始定期检查滚动
					this.scrollInterval = setInterval(this.checkScroll, 500);
				}
			},
			// getApiPlayerList() {
			// 	let section = this.pk_subsection == 0 ? 1 : this.pk_subsection == 5 ? null : this.pk_subsection
			// 	getPlayerList({
			// 		"tournamentId": this.id,
			// 	}).then(res => {
			// 		// this.pkDataOne = res.data
			// 	})
			// },
			getBigSmall(a, b) {
				return a > b
			},
			getPKInfo(playerId = "", pkIndex = 1) {
				// let section = this.pk_subsection == 0 ? 1 : this.pk_subsection == 5 ? null : this.pk_subsection
				let section = !this.pk_subsection ? null : this.pk_subsection == 0 ? 1 : this.pk_subsection == 5 ? null :
					this.pk_subsection
				this.pkPlayId = playerId
				this.pkIndex = pkIndex
				getPlayerPK({
					"tournamentId": this.id,
					"type": this.pk_Type,
					"subsection": section,
					"playerId": playerId,
				}).then(res => {
					console.log('res数据222', res.data)
					// let arr = ['twoPointRate', 'threePointRate', 'pointRate', 'rate']
					// Object.entries(res.data).forEach(([key, value]) => {
					// 	if (arr.includes(key)) {
					// 		res.data[key] = parseInt(res.data[key] * 100) + '%'
					// 	}
					// });

					if (pkIndex == 1) {
						this.pkDataOne = res.data
					}
					if (pkIndex == 2) {
						this.pkDataTwo = res.data
					}
				})
			},
			getLogoFn() {
				getLogo({
					tournamentId: this.id
				}).then(res => {
					this.logoData = res
				})
			},
			getInfo() {
				getLeagueH5League(this.id).then((res) => {
					this.info = res.data;
					if (this.info.state == 2) {
						getleague(this.id).then((data) => {
							this.liveNum = data.data.liveNum;
						});
					}
					uni.setNavigationBarTitle({
						// title: 比赛时间加 比赛主队 vs 比赛客队//this..name
						title: res.data.tournamentBeginTime + '  ' + res.data.teamOneName + ' vs ' + res
							.data
							.teamTwoName
						// title:this.name
					})
					// setTimeout(() => {
					this.$nextTick(() => {
						var ua = window.navigator.userAgent.toLowerCase();
						if (ua.match(/MicroMessenger/i) == 'micromessenger') {
							// 微信中打开
							uni.showLoading({
								title: "数据加载中..."
							})
							this.share();
						} else {
							// 普通浏览器中打开
						}
					})

					// }, 1500)
				});
			},
			onPlayLive(url) {
				this.isBack = true;
				this.videoSrc = url;
				this.isvideo = true;
				if (url.indexOf("mp4") != -1) {
					console.log("mp4");
				} else {
					this.initVideo(url);
				}
			},
			initVideo(url) {
				this.$nextTick(() => {
					let videoElement = document.querySelector("#jswebrtc video");
					console.log(videoElement.src, this.videoSrc);
					var hls = new Hls();
					console.log(hls, "---");
					hls.loadSource(this.videoSrc);
					hls.attachMedia(document.querySelector(`#jswebrtc video`));

					hls.on(Hls.Events.MANIFEST_PARSED, () => {
						// alert(1)
						uni.createVideoContext(`jswebrtc`, this).play();
					});
					hls.on(Hls.Events.ERROR, function(event, data) {
						// alert(2)
						console.error("HLS error:", data);
						if (data.details === "manifestLoadError") {
							// 处理 Manifest 加载错误
						}
					});
				});
			},
			_getLeagueH5LiveBegin() {
				// console.log(new JSWebrtc.Player,"-----")
				this.isvideo = true;
				this.isBack = false;
				this._getScore();
				setliveNum(this.id);
				getLeagueH5LiveBegin({
					tournamentId: this.id,
				}).then((res) => {
					console.log(res, "------视频播放");
					this.videoSrc = res.rows[0].viewUrl;
					this.initVideo(res.rows[0].viewUrl);
				});
			},
			_getLeagueH5PlayerLogList() {
				getLeagueH5PlayerLogList({
					tournamentId: this.id,
				}).then((res) => {
					this.playerLogList = res.rows;
				});
			},
			_getLeagueH5GetSummary() {
				getLeagueH5GetSummary({
					tournamentId: this.id,
				}).then((res) => {
					this.msg = res.msg;
				});
			},
			_getLeagueH5BestOfTheGame() {
				getLeagueH5BestOfTheGame({
					tournamentId: this.id,
				}).then((res) => {
					this.oneTeamList = res.oneTeamList;
					this.twoTeamList = res.twoTeamList;
				});
			},
			_getLeagueH5RealTimeData() {
				getLeagueH5RealTimeData({
					tournamentId: this.id,
				}).then((res) => {
					console.log(this.info, "----info");
					let one = res.data.mapList.find(
						(item) => item.teamId == this.info.teamOneId
					);
					let two = res.data.mapList.find(
						(item) => item.teamId == this.info.teamTwoId
					);
					console.log(one);
					// Q1
					this.qList = one.teamSubsectionScoreSum;
					this.qList1 = two.teamSubsectionScoreSum;
					this.teamSubsectionScoreSumTotal1 =
						one.teamSubsectionScoreSumTotal || 0;
					this.teamSubsectionScoreSumTotal2 =
						two.teamSubsectionScoreSumTotal || 0;
				});
			},
			_getLeagueH5RealTimeDataTeam() {
				getLeagueH5RealTimeDataTeam({
					tournamentId: this.id,
					basketballTeamId: this.info.teamOneId,
				}).then((res) => {
					if (res.data) {
						this.pkUser1 = res.data[0].name
						this.getPKInfo(res.data[0].basketballPlayerId, 1)
					}
					this.oneTeamScoreList = res.data;
					this.oneTeamTotalScoreList[0] = res.data.reduce(
						(accumulator, currentObject) => {
							return accumulator + currentObject.typeScoreSum;
						},
						0
					);

					for (let i = 0; i < res.data.length; i++) {
						const temp = 0;
						for (let j = 0; j < res.data[i].typeMapList.length; j++) {
							this.oneTeamTotalScoreList[j + 1] = 0;
							// temp += res.data[i].typeMapList[j].typeCount;
							// console.log(res.data[i].typeMapList[j].typeCount);
						}
					}
					for (let i = 0; i < res.data.length; i++) {
						const temp = 0;
						for (let j = 0; j < res.data[i].typeMapList.length; j++) {
							this.oneTeamTotalScoreList[j + 1] +=
								res.data[i].typeMapList[j].typeCount;
						}
					}
					for (let i = 0; i < 3; i++) {
						this.oneTeamTotalScoreList.pop();
					}
					console.log(this.oneTeamTotalScoreList);
				});
			},
			_getLeagueH5RealTimeDataTeam2() {
				getLeagueH5RealTimeDataTeam({
					tournamentId: this.id,
					basketballTeamId: this.info.teamTwoId,
				}).then((res) => {
					if (res.data) {
						this.pkUser2 = res.data[0].name
						this.getPKInfo(res.data[0].basketballPlayerId, 2)
					}
					this.twoTeamScoreList = res.data;
					this.twoTeamTotalScoreList[0] = res.data.reduce(
						(accumulator, currentObject) => {
							return accumulator + currentObject.typeScoreSum;
						},
						0
					);

					for (let i = 0; i < res.data.length; i++) {
						const temp = 0;
						for (let j = 0; j < res.data[i].typeMapList.length; j++) {
							this.twoTeamTotalScoreList[j + 1] = 0;
							// temp += res.data[i].typeMapList[j].typeCount;
							// console.log(res.data[i].typeMapList[j].typeCount);
						}
					}
					for (let i = 0; i < res.data.length; i++) {
						const temp = 0;
						for (let j = 0; j < res.data[i].typeMapList.length; j++) {
							this.twoTeamTotalScoreList[j + 1] +=
								res.data[i].typeMapList[j].typeCount;
						}
					}
					for (let i = 0; i < 3; i++) {
						this.twoTeamTotalScoreList.pop();
					}
				});
			},
			_getLeagueH5playerLogdownBox() {
				if (this.info.state == 0) {
					return;
				}
				getLeagueH5playerLogdownBox({
					contestId: this.contestId,
				}).then((res) => {
					let filterKeyMap =
						this.scoringWay == 0 ? ["一分命中率"] :
						this.scoringWay == 1 ? ["三分命中率"] : [];
					let list = res.data || [];
					console.log("list", filterKeyMap, list);
					list.filter((i) => {
						console.log("info", i.info, filterKeyMap.includes(i.info));
					});
					// console.log(
					//   "f",
					//   list.filter((i) => !filterKeyMap.includes(i.info))
					// );
					this.titleList = list.filter((i) => !filterKeyMap.includes(i.info));
				});
			},
			removeCodeAndState(url) {
				// 正则匹配 code= 和 state= 的部分
				const regex = /code=[^&]*&state=[^&#]*\?{0,1}/;

				// 使用正则替换匹配的部分，并且处理可能的 `/?#` 变成 `/#`
				const cleanedUrl = url.replace(regex, "").replace("/?#", "/#");

				return cleanedUrl;
			},
			async handleLogin() {
				console.log("进入handleLogin函数");
				// uni.setStorageSync("wechat_login_tag", "true");
				const appID = this.appID;
				const appSecret = this.appSecret;
				// this.isLoggedIn = true
				let currentUrl = window.location.href;
				currentUrl = this.removeCodeAndState(currentUrl);

				window.location.href =
					"https://open.weixin.qq.com/connect/oauth2/authorize?appid=" +
					appID +
					"&redirect_uri=" +
					encodeURIComponent(currentUrl) + // 使用当前页面的 URL
					"&response_type=code&scope=snsapi_userinfo&state=1#wechat_redirect";
			},
			// 获取重定向联接中的code
			async getwxCode() {
				console.log("进入getwxcode函数");
				const code = this.getQueryParameter("code");
				const userInfo = sessionStorage.getItem("userInfo");
				if (userInfo) {
					this.isLoggedIn = true;
					return;
				}
				if (code) {
					console.log("请求后端获取用户信息");
					try {
						const tokenResponse = await getAccessTokenNew({
							code: code,
						});
						sessionStorage.setItem(
							"tokenResponse",
							JSON.stringify(tokenResponse.data)
						);
						const accessToken = tokenResponse.data.accessToken;
						const userInfo = await getUserInfoNew({
							accessToken: accessToken,
						});
						sessionStorage.setItem("userInfo", JSON.stringify(userInfo.data));
						localStorage.setItem("isLoggedIn", "true");
						this.isLoggedIn = true;
						this.userInfo = userInfo.data;
						this.userid = userInfo.data.openid;
						this.getMessagesList();
						this.loginBtn = true;
						uni.showToast({
							title: "登录成功",
							icon: "success",
							durtation: 3000,
						});
					} catch (error) {
						console.error("获取 access_token 失败:", error);
						throw error;
						uni.showToast({
							title: "登录出错",
							icon: "error",
							durtation: 3000,
						});
					}
				} else {
					this.isLoggedIn = false;
					this.changeTab(0);
					localStorage.setItem("isLoggedIn", "false");
					if (sessionStorage.getItem("special_index") == 4) {
						uni.showToast({
							title: "未授权",
							icon: "error",
							duration: 2000,
						});
					}
					console.log("没有code");
				}
				console.log("结束getwxcode函数");
			},
			// 获取accessToken
			async getAccessToken(appid, appsecret, code) {
				const url =
					`https://api.weixin.qq.com/sns/oauth2/access_token?appid=${appid}&secret=${appsecret}&code=${code}&grant_type=authorization_code`;
				try {
					const response = await axios.get(url);
					return response.data; // 返回包含 access_token 和 openid 的对象
				} catch (error) {
					console.error("获取 access_token 失败:", error);
					throw error;
				}
			},

			// 获取用户信息的函数
			async getUserInfo(accessToken, openid) {
				const url =
					`https://api.weixin.qq.com/sns/userinfo?access_token=${accessToken}&openid=${openid}&lang=zh_CN`;

				try {
					const response = await axios.get(url);
					return response.data; // 返回用户信息
				} catch (error) {
					console.error("获取用户信息失败:", error);
					throw error;
				}
			},
			getQueryParameter(name) {
				const urlParams = new URLSearchParams(window.location.search);
				return urlParams.get(name);
			},

			_getLeagueH5TeamCompare() {
				getLeagueH5TeamCompare({
					tournamentId: this.id,
				}).then((res) => {
					this.oneTeam = res.oneTeam;
					this.twoTeam = res.twoTeam;
				});
			},
			_getScore() {
				var that = this;
				getScore({
					tournamentId: this.id,
				}).then((res) => {
					this.oneNum = res.data.teamOneScore;
					this.twoNum = res.data.teamTwoScore;
					this.subsection = res.data.subsection;
					this.contestName = res.data.contestName;
					this.teamOneName = res.data.teamOneName;
					this.teamTwoName = res.data.teamTwoName;
				});
				this.time = setInterval(() => {
					getScore({
						tournamentId: this.id,
					}).then((res) => {
						this.scoreObj = res.data //
						this.$nextTick(() => {
							if (!this.isFullscreen) {
								let view = uni.createSelectorQuery().in(this).select("#jswebrtc");
								let bifen = uni.createSelectorQuery().in(this).select(".bifen");
								view.boundingClientRect((videoStyle) => {
									bifen.boundingClientRect((bifenStyle) => {
										that.videoScoreStyle = {
											top: videoStyle.height - bifenStyle
												.height - 20 + 'px'
										}
									}).exec();
								}).exec();
							} else {
								that.videoScoreStyle = {
									bottom: '20px',
									width: '50%',
									left: '25%'
								}
							}
						})
						this.oneNum = res.data.teamOneScore;
						this.twoNum = res.data.teamTwoScore;
						this.subsection = res.data.subsection;
					});
				}, 5000);
			},
			//接受聊天室消息
			async fetchMessages() {
				console.log("被调用了");
				if (this.lastFetchDate === undefined) {
					this.lastFetchDate = new Date();
				}
				const params = {
					tournamentId: this.id,
					date: formatDate(this.lastFetchDate), // 如果没有lastFetchDate则使用当前时间
					// date: this.lastFetchDate === undfined ? formatDate(new Date().toISOString()):formatDate(this.lastFetchDate)  // 如果没有lastFetchDate则使用当前时间
				};
				try {
					const response = await getChat(params);
					if (response.data === undefined) {
						this.messages = [];
						return;
					} else {
						const length = this.messages.length;
						this.messages = response.data;
						if (this.messages.length !== length) {
							this.$nextTick(() => {
								this.scrollToBottom();
							});
						}
					}
					if (this.messages.length) {
						this.lastFetchDate = this.messages[0].timestamp; // 更新最后获取消息的时间
					}
				} catch (err) {
					console.log("err", err);
				}
			},
			async isIngCompare() {
				const res = await axios.get(
					`http://m.yundongshugenmatch.cn/api/system/league/h5/${this.id}`
				);
				this.isIng = res.data.data.state;
				if (this.isIng == 1) {
					return true;
				} else {
					return false;
				}
			},
			getUserOpenid() {
				const userinfo = JSON.parse(sessionStorage.getItem("userInfo"));
				if (userinfo) {
					this.userid = userinfo.openid;
				}
			},
			handleTabUrl() {
				// 检查当前URL中是否含有tabIndex属性
				const specialTabIdx = sessionStorage.getItem("special_index");
				if (!specialTabIdx) {
					this.tab = 0;
				}
			},
			async sendMessage() {
				if (this.newMessage.trim() === "") {
					uni.showToast({
						title: "消息不能为空",
						icon: "none",
						duration: 2000,
					});
					return;
				}
				const userInfo = JSON.parse(sessionStorage.getItem("userInfo"));
				if (userInfo === null) {
					uni.showToast({
						title: "请登录后重试",
						icon: "error",
						duration: 2000,
					});
					this.newMessage = "";
					this.loginBtn = false;
					return;
				} else {
					const message = {
						userId: userInfo.openid,
						userName: userInfo.nickname || `用户${this.messages.length + 1}`,
						userImg: userInfo.headImgUrl,
						tournamentId: this.id,
						context: this.newMessage.trim(),
					};
					try {
						const res = await sendChat(message);
						// 模拟消息发送后的行为，比如重新获取消息列表
						this.fetchMessages();
					} catch (err) {
						console.log("err", err);
						uni.showToast({
							title: "消息发送失败",
							icon: "error",
							duration: 2000,
						});
					}

					this.newMessage = "";
				}
			},
			scrollToBottom() {
				const chatRoom = document.getElementById("chat-room");
				chatRoom.scrollTop = chatRoom.scrollHeight;
			},
			getMessagesList() {
				try {
					const that = this;
					this.messagesInterval = setInterval(() => {
						that.fetchMessages();
					}, 1000);
					console.log(this.messagesInterval);
				} catch (err) {
					console.log(err);
				}
			},
			handleChatRoomClick(event) {
				this.lastInteractionTime = Date.now();
			},
			handleChatRoomTouchStart(event) {
				this.lastInteractionTime = Date.now();
			},
			handleChatRoomTouchEnd(event) {
				this.lastInteractionTime = Date.now();
			},
			checkScroll() {
				const currentTime = Date.now();
				if (this.lastInteractionTime == 0) {
					return;
				}
				if (currentTime - this.lastInteractionTime > 4000) {
					// 否则，滚动到最新消息
					this.scrollToBottom();
				}
			},
			b64toBlob(b64Data, contentType, sliceSize) {
				contentType = contentType || '';
				sliceSize = sliceSize || 512;

				const byteCharacters = atob(b64Data);
				const byteArrays = [];

				for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {
					const slice = byteCharacters.slice(offset, offset + sliceSize);

					const byteNumbers = new Array(slice.length);
					for (let i = 0; i < slice.length; i++) {
						byteNumbers[i] = slice.charCodeAt(i);
					}

					const byteArray = new Uint8Array(byteNumbers);
					byteArrays.push(byteArray);
				}

				const blob = new Blob(byteArrays, {
					type: contentType
				});
				return Promise.resolve(blob);
			},
		},
	};
</script>

<style scoped lang="scss">
	page {
		background-color: #efefef;
		height: 100%;
	}

	.banner {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 99;
		width: 100%;
		height: 460rpx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;

		image {
			width: 100%;
			height: 100%;
		}

		.info-box {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;

			.info-title {
				font-weight: 700;
				padding-top: 66rpx;
				text-align: center;
				color: rgb(255, 238, 255);
				font-size: 29rpx;
			}

			.tean-box {
				color: #fff;
				padding: 50rpx 0;
				display: flex;
				justify-content: space-around;

				&>view {
					flex: 1;
				}

				image {
					width: 90rpx;
					height: 90rpx;
					border-radius: 50%;
				}

				text-align: center;

				.time {
					font-size: 20rpx;
				}

				.num {
					padding: 20rpx 0;
					font-size: 50rpx;
					font-weight: 600;
				}

				.team-name {
					padding-top: 20rpx;
					font-size: 29rpx;
					font-weight: bold;
				}

				.state {
					font-size: 26rpx;
				}
			}

			.video-box {
				margin: auto;
				font-weight: 700;
				font-size: 26rpx;
				text-align: center;
				padding: 4rpx;
				background: #3067ff none repeat scroll 0 0;
				color: #fff;
				width: 180rpx;
				height: 40rpx;
				line-height: 39rpx;
				border-radius: 20rpx;
			}
		}
	}

	.main-box {
		.backbtnbody {
			background-color: #fff;
			padding-top: 20rpx;

			.backBtn {
				width: 80%;
				font-size: 28rpx;
			}
		}

		// Tab
		.team-body {
			width: 100%;
			height: 100%;
			background: #fff;
			padding: 25rpx;
			box-sizing: border-box;
			margin-bottom: 10px;

			.tab-box {
				width: 100%;
				display: flex;
				height: 72rpx;
				line-height: 72rpx;
				text-align: center;
				border: 1px solid #f1f1f1;
				color: #999;
				font-size: 28rpx;
				border-radius: 72rpx;
				overflow: hidden;

				.tab-box-small {
					width: 25%;
					text-align: center;
					border-right: 1px solid #f1f1f1;
				}

				.tab-box-small:nth-child(4) {
					border-right: 0;
				}

				.active {
					background: #f63 !important;
					color: #fff;
				}
			}
		}

		// 交互
		.interact {
			width: 100%;
			background-color: #ffffff;
			min-height: 100px;
			display: flex;
			align-items: center;
			justify-content: center;

			.wx-login {
				width: 100%;

				button {
					width: 60%;
					border-radius: 10px;
					color: white;
					background-color: #57a7ff;
				}
			}

			.interact-box {
				width: 100%;

				.chat {
					width: 100%;
					padding: 10px 10px;

					.chat-room {
						width: 100%;
						height: 350px;
						background-color: #f6f6f6;
						padding: 0px 10px;
						padding-top: 10px;
						box-sizing: border-box;
						border-radius: 10px;
						overflow: auto;

						.null-show {
							width: 100%;
							height: 100%;
							display: flex;
							align-items: center;
							justify-content: center;

							span {
								color: red;
								font-size: 34rpx;
								font-weight: 500;
								color: #8c8c8c;
							}
						}

						.user-info-box {
							.username-span {
								color: #007aff;
							}
						}

						.user-info-box-self {
							display: flex;
							justify-content: flex-end;

							.username-span {
								color: #ff6633;
							}
						}

						.user-mes-box {
							width: 100%;
							height: 100%;
							display: flex;
							align-items: center;
							justify-content: flex-start;

							.user-image {
								width: 20%;
								display: flex;
								align-items: flex-start;
								justify-content: center;
								padding: 10rpx;

								image {
									max-width: 100rpx;
									border-radius: 50%;
								}
							}

							.message-detail {
								display: flex;
								align-items: center;
								height: 100%;
								max-width: 60%;
								position: relative;

								.message {
									height: 100%;
									word-wrap: break-word;
									word-break: break-all;
									background-color: #57a7ff;
									color: white;
									box-sizing: border-box;
									padding: 10px;
									border-radius: 10px;
								}

								span {
									position: absolute;
									display: inline-block;
									top: 50%;
									left: 0%;
									transform: translate(-78%, -50%);
									width: 0;
									height: 0;
									border: 20rpx solid;
									border-color: transparent #57a7ff transparent transparent;
								}
							}
						}

						.user-mes-box-self {
							width: 100%;
							height: 100%;
							display: flex;
							align-items: center;
							justify-content: flex-end;

							.user-image {
								width: 20%;
								display: flex;
								align-items: flex-start;
								justify-content: center;
								padding: 10rpx;

								image {
									max-width: 100rpx;
									border-radius: 50%;
								}
							}

							.message-detail {
								display: flex;
								align-items: center;
								height: 100%;
								max-width: 60%;
								position: relative;

								.message {
									height: 100%;
									word-wrap: break-word;
									word-break: break-all;
									background-color: #ff6633;
									color: white;
									box-sizing: border-box;
									padding: 10px;
									border-radius: 10px;
								}

								span {
									position: absolute;
									display: inline-block;
									top: 50%;
									right: 0%;
									transform: translate(78%, -50%);
									width: 0;
									height: 0;
									border: 20rpx solid;
									border-color: transparent transparent transparent #ff6633;
								}
							}
						}

						.edit-message {
							width: 100%;
							height: 50px; // 修改消息发送框高度
							margin-top: 10px;

							div {
								// width: 95%; // 修改消息发送狂宽度
								// margin: 0 auto;
								display: flex;
								border-radius: 10px;
								// justify-content: center;
								background-color: transparent;

								.not-ing-input {
									border-left: solid 2px #e0e0e0;
									border-top: solid 2px #e0e0e0;
									border-bottom: solid 2px #e0e0e0;
								}

								.not-ing-button {
									background-color: #e0e0e0;
								}

								input {
									border-radius: 10px 0 0 10px;
									text-align: left;
									display: inline-block;
									width: 80%;
									height: 50px;
									background-color: #edf2fa;
									padding-left: 1em;
									border-left: solid 2px #007aff;
									border-top: solid 2px #007aff;
									border-bottom: solid 2px #007aff;
								}

								button {
									border: 0;
									outline: 0;
									border-radius: 0 10px 10px 0;
									height: 100%;
									line-height: 50px; // 修改消息发送框高度
									width: 20%;
									// font-size: 20rpx;
									white-space: nowrap;
									// border-radius: 0;
									padding: 0;
									background-color: #007aff;
									color: white;
								}
							}
						}
					}
				}
			}
		}

		// 视频
		.video {
			// margin-top: 25rpx;
			width: 100%;
			// padding: 25rpx 0;
			font-size: 32rpx;
			background-color: #ffffff;

			.playList {
				width: 100%;
				display: flex;
				overflow-x: auto;
				white-space: nowrap;

				.playBox {
					padding: 10rpx 20rpx;
					text-align: center;

					.playName {
						font-size: 32rpx;
						padding-bottom: 10rpx;
						font-weight: 700;
					}

					.playNum {
						font-size: 26rpx;
						color: #b5b5b5;
					}

					.active {
						color: #f63;
					}

					.active2 {
						color: #fff;
						background: #f63;
						padding: 2rpx 6rpx;
						border-radius: 20rpx;
					}
				}
			}

			.video-title {
				font-weight: 700;
				margin: 10px;
			}

			.video-img {
				width: 70%;
				height: auto;
				// margin: auto;
				margin-top: 40rpx;
			}

			image {
				width: 100%;
			}

			.none-box {
				text-align: center;
				font-size: 400 !important;
				font-size: 28rpx;
				color: #999;
			}

			.video-back {
				display: flex;
				flex-wrap: wrap;
				justify-content: space-between;

				&>view {
					width: calc((100% / 3) - 20rpx);
					margin-bottom: 20rpx;
					text-align: center;

					&:nth-child(3n - 1) {
						margin: 0 20rpx;
					}
				}

				image {
					width: 189rpx;
					height: 189rpx;
					margin-bottom: 20rpx;
				}

				margin-top: 30rpx;
				font-size: 20rpx;
				color: #ff6633;

				.video-text {
					text-align: center;
				}
			}
		}

		// 球员PK
		.pk-tab {
			background-color: #fff;
			display: flex;
			align-items: center;
			justify-content: space-around;
			padding-top: 30rpx;

			.dataBox-pk-item {
				color: #999;
				font-weight: bold;
			}

			.pkActive {
				color: #000;
				border-bottom: 4rpx solid #f63;
				padding-bottom: 16rpx;
			}
		}

		.pk-title {
			font-weight: bold;
			font-size: 30rpx;
			background: #fff;
			padding: 30rpx 0 0 30rpx;
		}

		.playerFenxi {
			text-align: center;
			color: #999;
			padding: 20rpx 0;
			background: #fff;
		}

		//赛况
		.matchResult {
			width: 100%;
			padding: 25rpx;
			box-sizing: border-box;
			background-color: #fff;

			.list {
				width: 100%;
				padding: 20rpx;
				box-sizing: border-box;
				border-left: 4rpx solid #5dac81;
				position: relative;

				.dian {
					position: absolute;
					top: 0;
					left: -10rpx;
					width: 20rpx;
					height: 20rpx;
					border-radius: 50%;
					background: #5dac81;
				}

				.list-title {
					width: 100%;
					display: flex;
					text-align: right;
					justify-content: space-between;
				}

				.list-content {
					width: 100%;
					margin-top: 10rpx;
					background-color: #f6f6f6;
					padding: 20rpx;
					border-radius: 10rpx;
				}
			}
		}


		// 数据
		.dataBox {
			width: 100%;
			box-sizing: border-box;
			background-color: #fff;

			.dataBox-tab {
				.team-body1 {
					width: 100%;
					height: 100%;
					background: #fff;
					padding: 25rpx 25rpx 0;
					box-sizing: border-box;

					.tab-box1 {
						width: 100%;
						display: flex;
						height: 72rpx;
						line-height: 72rpx;
						text-align: center;
						border: 1px solid #f1f1f1;
						color: #999;
						font-size: 28rpx;
						border-radius: 72rpx;
						overflow: hidden;

						.tab-box-small2 {
							font-weight: bold;
							width: 34%;
							text-align: center;
							border-right: 1px solid #f1f1f1;
						}

						.tab-box-small2:nth-child(3) {
							border-right: 0;
						}

						.active2 {
							background: #f63 !important;
							color: #fff;
						}
					}
				}

			}

			.dataBox-team {
				display: flex;
				align-items: center;
				padding: 10rpx 10rpx 0;
				background: #f3f3f3;
				position: relative;
				z-index: 10;

				.dataBox-team-item {
					width: 50%;
					display: flex;
					align-items: center;
					justify-content: center;
					padding: 16rpx;
					color: #666;

					image {
						width: 50rpx;
						height: 50rpx;
						margin-right: 10rpx;
						border-radius: 50%;
					}

					.dataBox-team-title {
						view:nth-child(1) {}

						view:nth-child(2) {
							color: #999;
							font-size: 22rpx;
						}
					}
				}

				.teamActive {
					background: #fff;
					border-radius: 40rpx 40rpx 0 0;
					color: #000 !important;
					font-weight: bold;
				}
			}

			.dataBox-title {
				padding: 25rpx;
				width: 100%;
				background: #efefef;
				font-size: 24rpx;
				color: #999;
				// margin-left: -5%;
			}

			.good {
				width: 100%;
				display: flex;

				.good-oneTeam {
					width: 46%;

					.good-oneTeam-list {
						width: 100%;
						display: flex;
						align-items: center;
						justify-content: space-between;
						padding: 20rpx 0;

						.good-oneTeam-list-left {
							display: flex;
							align-items: center;
						}

						image {
							width: 46rpx;
							height: 46rpx;
							border-radius: 50%;
						}

						.dataBox-goodList-name {
							font-size: 26rpx;
							color: #333;
							margin-left: 20rpx;
							margin-right: 10rpx;
						}
					}
				}

				.good-type {
					display: flex;
					flex-direction: column;
					justify-content: space-around;
				}

				.good-type-text {
					// padding: 30rpx 0;
					font-size: 26rpx;
					color: #999;
				}
			}

			.compare {
				width: 100%;
				text-align: center;
				padding: 20rpx;
				// padding: 20rpx 0;

				.compare-title {
					width: 100%;
					font-size: 20rpx;
					color: #333;
					font-weight: bold;
				}

				.compare-score {
					width: 100%;
					display: flex;
					justify-content: space-between;
					font-size: 26rpx;
					color: #333;
					padding: 10rpx 0;

					.line-box {
						display: flex;
						align-items: center;
						justify-content: space-between;

						.line {
							width: 250rpx;
							height: 10rpx;
							background: #dedede;
							margin-right: 10rpx;
							position: relative;
						}

						.active {
							height: 100%;
							position: absolute;
							top: 0;
							right: 0;
							background: #f63;
						}

						.active2 {
							height: 100%;
							position: absolute;
							top: 0;
							left: 0;
							background: #f63;
						}
					}
				}
			}

			.dataBox-goodList {
				width: 100%;
				padding: 25rpx 0;
				display: flex;
				justify-content: space-between;
				align-items: center;

				.dataBox-goodList-head {
					display: flex;
					align-items: center;

					image {
						width: 46rpx;
						height: 46rpx;
						border-radius: 50%;
					}
				}

				.dataBox-goodList-score {
					display: flex;
					align-items: center;
					font-size: 24rpx;
					color: #999;

					.dataBox-goodList-score-text {
						padding: 0 10rpx;
					}
				}
			}

			.allContent {
				height: 700rpx;
				overflow-y: auto;
				position: relative;
				margin-top: -86rpx;
			}

			.turnDiv {
				position: sticky;
				left: 8rpx;
				top: 50%;

				.turnImage {
					width: 36rpx;
					height: 50rpx;
					display: block;
				}

				.turnImageTop {
					transform: rotate(180deg);
					left: 20rpx !important;
				}
			}

			.teamBig-box {
				width: 100%;
				display: flex;
				padding: 25rpx;

				.teamBig-box-left {
					width: 35%;

					.score-title {
						display: flex;
						// padding: 24rpx 0;
						padding-left: 30%;
						font-size: 24rpx;
						font-weight: bold;
						// color: #999;
						color: #000;
						height: 74rpx;
						line-height: 74rpx;
					}

					.oneTemeList {
						padding: 25rpx 0;
						display: flex;
						align-items: center;
						justify-content: center;
						font-size: 22rpx;
						height: 74rpx;

						.oneTemeList-name {
							padding-left: 10rpx;
						}
					}
				}

				.teamBig-box-right {
					width: 100%;

					.score-title {
						display: flex;
						flex-wrap: nowrap;
						width: 100%;
						height: 74rpx;
						line-height: 74rpx;
						// padding-left: 10%;
						font-size: 22rpx;
						color: #999;
						// border-bottom: 2rpx solid #efefef;

						.score-title-text {
							text-align: center;
							flex: 0 0 70px;
							font-weight: bold;
						}
					}

					.oneTemeList-score {}
				}
			}
		}

		//比赛信息
		.game-info {
			width: 100%;

			.game-info-title {
				width: 100%;
				padding: 25rpx;
				font-size: 32rpx;
				font-weight: 700;
				background: #efefef;
			}

			.game-list-info {
				width: 100%;
				background: #fff;
				padding: 20rpx 25rpx;
				box-sizing: border-box;

				.game-list {
					width: 100%;
					display: flex;
					justify-content: space-between;
					align-items: center;
					padding: 20rpx 0;
					border-bottom: 1px solid #f1f1f1;

					.game-list-left {
						display: flex;
						align-items: center;

						image {
							width: 50rpx;
							height: 50rpx;
							margin-right: 10rpx;
						}
					}
				}

				.game-list:nth-child(3) {
					border-bottom: 0;
				}
			}
		}

	}

	.bannerstatus {
		.liveNum {
			position: absolute;
			bottom: 20rpx;
			right: 20rpx;
			color: #fff;
			z-index: 9;
			font-size: 26rpx;
		}
	}

	.pdfContent {
		display: inline-block;
		width: 720rpx;
		white-space: nowrap;
		overflow: scroll;
		max-height: 1000rpx;
	}

	// 表格样式
	.table-container {}

	.stats-table {
		width: 100%;
		border-collapse: collapse;
		text-align: center;
	}

	.stats-table th,
	.stats-table td {
		border: 1px solid #ccc;
		padding: 8px;
	}

	.stats-table th {
		background-color: #f0f0f0;
		font-weight: bold;
	}

	// 水印样式
	.logoClass {
		position: fixed;
		right: 10px;
		top: 10px;

		image {
			width: 60px;
			// height: 30px;
		}
	}

	// 底部比分栏样式
	.bifen {
		position: fixed;
		left: 5%;
		// position: absolute;
		// top: 22%;
		// top: 160px;
		// left: -20px;
		z-index: 999;
		color: #fff;
		// width: 100%;
		width: 90%;
		justify-content: center;
		align-items: center;

		.calssName {
			font-size: 12px;
			text-align: center;
			margin-bottom: 8px;
			opacity: 0.7;
		}

		.fen-box {
			// width: 90%;
			width: 100%;
			display: flex;
			margin: auto;
			justify-content: center;
			// opacity: 0.7;
			color: #fff;

			.sub {
				background: linear-gradient(to right,
						rgb(82, 82, 82),
						rgb(105, 105, 105),
						rgb(128, 128, 128));
				height: 44rpx;
				width: 100rpx;
				transform: translate(16px, 0px);
				border-top-left-radius: 68px;
				border-bottom-left-radius: 68px;
				display: flex;
				align-items: center;
				padding-left: 20rpx;
				font-size: 20rpx;
			}

			.sanjiao {
				width: 0;
				height: 0;
				border-left: 20px solid #f2f2f2;
				border-right: 20px solid gray;
				border-top: 22px solid #7DBA98;
				position: relative;
				/* 确保可以加阴影 */
				// box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.3);
				/* 添加阴影效果 */
			}

			.item {
				display: flex;
				width: 40%;
				height: 44rpx;
				align-items: center;
				justify-content: space-around;
				color: #fff;
				flex-direction: row;
				font-size: 20rpx;

				&.one {
					transform: translate(0px, 0px);
					background: linear-gradient(to right,
							rgb(196, 196, 196),
							rgb(219, 219, 219),
							rgb(242, 242, 242));
					border-top-left-radius: 68px;
					border-bottom-left-radius: 68px;

					// 主队犯规条
					.name {
						position: relative;

						.itemFg {
							// position: absolute;
							// bottom: 1px;
							// left: 30px;
							display: flex;
							align-items: center;
							justify-content: center;
							margin-top: 2px;

							.fgItem {
								width: 6px;
								height: 2px;
								margin-right: 3px;
							}
						}
					}
				}

				&.two {
					background: linear-gradient(to right,
							rgb(128, 128, 128),
							rgb(105, 105, 105),
							rgb(82, 82, 82));
					border-top-right-radius: 68px;
					border-bottom-right-radius: 68px;
					color: #fff;

					// 客队犯规条
					.name {
						position: relative;

						.itemFg {
							// position: absolute;
							// bottom: 1px;
							// left: -30px;
							display: flex;
							align-items: center;
							justify-content: center;
							margin-top: 2px;

							.fgItem {
								width: 6px;
								height: 2px;
								margin-right: 3px;
							}
						}
					}
				}

				.data-list {
					display: flex;
					justify-content: space-between;

					view {
						width: calc((100% / 5) - 20rpx);
						height: 20rpx;
						border-radius: 30rpx;
						background-color: red;
					}
				}
			}
		}
	}

	// 关键数据 进度条图
	// .half-circle {
	// 	width: 100px;
	// 	height: 50px;
	// 	border: 6px solid #004819;
	// 	border-bottom: none;
	// 	border-radius: 50px 50px 0 0;
	// }
	.half-content {
		display: flex;
		justify-content: space-around;
		align-items: center;

		.left-text {
			.left-item:nth-child(1) {
				margin-bottom: 10rpx;
			}

			.left-item {
				text-align: center;

				image {
					width: 40rpx;
					height: 40rpx;
					border-radius: 50%;
				}

				view {
					font-size: 24rpx;
					//
					white-space: nowrap;
					/* 强制文本在一行显示 */
					overflow: hidden;
					/* 隐藏超出部分 */
					text-overflow: ellipsis;
					/* 超出部分用省略号代替 */
					max-width: 5em;
					/* 限制宽度为2个字的宽度 */
				}
			}
		}

		.half-circle-box {
			position: relative;
			// width: 200rpx;
			// height: 200rpx;

			.middle-text {
				position: absolute;
				z-index: 3 !important;
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%);
				font-size: 22rpx;
				font-weight: bold;
				color: #333;
				white-space: nowrap;
			}

			.gray {
				transform: rotate(180deg);
				margin-top: -180rpx;
				border: 4rpx solid #eee !important;
				margin-left: 4rpx;
				width: 136rpx !important;
				height: 150rpx !important;
				position: relative;
				z-index: 1 !important;
			}

			.half-circle-clip {
				position: relative;
				z-index: 2;
				width: 120rpx;
				height: 140rpx;
				/* 完整圆形尺寸 */
				border: 16rpx solid #004819;
				/* 完整边框 */

				/* 关键切割：保留上半部分（含完整边框） */
				clip-path: polygon(-3px -3px,
						/* 左上角外扩3px（覆盖边框） */
						calc(100% + 3px) -3px,
						/* 右上角外扩3px */
						calc(100% + 3px) 51%,
						/* 右下角保留50% + 3px */
						-3px 51%
						/* 左下角保留50% + 3px */
					);
				/* 先画完整圆 */
				border-radius: 50%;

				.top-bg {
					position: absolute;
					z-index: 3 !important;
					// top: 50%;
					left: 50%;
					transform: translate(-50%, -60%);
					background: #004819;
					// margin-top: -50rpx;
					font-size: 30rpx;
					color: #fff;
					font-weight: bold;
					// height: 50rpx;
					// width: 50rpx;
					padding: 14rpx 10rpx 6rpx;
					margin: 0 auto;
					display: flex;
					align-items: center;
					justify-content: center;
				}

				.top-gray {
					background: #BABAC1 !important;
					// transform: translate(-50%, -80%) !important;
					padding: 10rpx 10rpx 2rpx !important;
					transform: rotate(180deg) !important;
					padding: 4rpx 10rpx 6rpx !important;
					left: 31% !important;
					top: -8%;
				}

				.top-gray2 {
					background: #BABAC1 !important;
					padding: 10rpx 10rpx 2rpx !important;
					// transform: rotate(180deg) !important;
					// padding: 4rpx 10rpx 6rpx !important;
					// left: 31% !important;
					top: 7%;
				}
			}
		}
	}

	.bottom-text {
		text-align: center;
		margin-top: 20rpx;
		color: #999;
	}

	//关键数据-更多数据弹窗内容
	.moreData {
		.top-title {
			position: relative;
			margin: 30rpx 20rpx 20rpx;
			display: flex;
			justify-content: center;
			align-items: center;

			.icon {
				position: absolute;
				right: 20rpx;
			}
		}

		.more-content {
			padding: 0 30rpx;

			.more-all {
				display: flex;
				align-items: center;
				border-bottom: 1rpx solid #eee;

				.more-tab {
					padding-bottom: 10rpx;
					margin-right: 30rpx;
				}

				.moreActive {
					font-weight: bold;
					border-bottom: 4rpx solid #5878E6;
				}
			}

			.compare2 {
				width: 100%;
				text-align: center;
				padding: 20rpx 0 0;
				// padding: 20rpx 0;
				position: relative;

				.compare-title2 {
					font-weight: bold;
					color: #666;
					position: absolute;
					bottom: 33%;
					left: 50%;
					transform: translate(-50%, 100%);
					font-weight: bold;
				}

				.compare-vs {
					position: absolute;
					bottom: 50%;
					left: 50%;
					transform: translate(-50%, -50%);
					display: flex;
					justify-content: space-between;
					align-items: center;
					width: 60%;

					.t-name {
						font-size: 24rpx;
						//
						white-space: nowrap;
						/* 强制文本在一行显示 */
						overflow: hidden;
						/* 隐藏超出部分 */
						text-overflow: ellipsis;
						/* 超出部分用省略号代替 */
						/* 限制宽度为2个字的宽度 */
						// max-width: 5em;
						width: 100rpx;
					}
				}

				.compare-score2 {
					width: 100%;
					display: flex;
					justify-content: space-between;
					font-size: 26rpx;
					color: #333;
					padding: 10rpx 0;

					.line-tame {
						text-align: center;

						image {
							width: 70rpx;
							height: 70rpx;
						}

						.t-number {
							font-size: 40rpx;
							font-weight: bold;
						}

					}

					.line-box {
						display: flex;
						align-items: center;
						justify-content: space-between;

						.line {
							width: 250rpx;
							height: 10rpx;
							background: #dedede;
							margin-right: 10rpx;
							position: relative;
						}

						.active {
							height: 100%;
							position: absolute;
							top: 0;
							right: 0;
							background: #f63;
						}

						.active2 {
							height: 100%;
							position: absolute;
							top: 0;
							left: 0;
							background: #f63;
						}
					}
				}

				.compare-score3 {
					width: 100%;
					display: flex;
					justify-content: space-between;
					font-size: 26rpx;
					color: #333;
					padding: 10rpx 0;

					.line-box {
						display: flex;
						align-items: center;
						justify-content: space-between;

						.line {
							width: 250rpx;
							height: 10rpx;
							background: #dedede;
							margin-right: 10rpx;
							position: relative;
						}

						.active {
							height: 100%;
							position: absolute;
							top: 0;
							right: 0;
							background: #f63;
						}

						.active2 {
							height: 100%;
							position: absolute;
							top: 0;
							left: 0;
							background: #f63;
						}
					}
				}
			}

			.t-bottom {
				display: flex;
				justify-content: space-between;
				margin-top: 20rpx;
				margin-bottom: 40rpx;

				.t-item {
					width: 40%;

					.t-item-top {
						margin: 20rpx 0;

						text:nth-child(1) {
							font-size: 30rpx;
							color: #333;
							margin-right: 30rpx;
						}

						text:nth-child(2) {
							color: #999;
							font-size: 28rpx;
						}
					}

					.t-item-content {
						display: flex;
						justify-content: space-between;
						margin-bottom: 10rpx;

						.t-item-content-left {
							color: #999;
						}

						.t-item-content-right {
							color: #333;
						}
					}
				}
			}
		}

		//pk选择球员
		.pkContent {
			display: flex;
			padding: 0 40rpx;

			view {
				width: 50%;
			}

			.pk-left {
				border-right: 2rpx solid #eee;
			}

			.pk-item {
				margin-bottom: 20rpx;
				color: #999;
			}

			.pk-title2 {
				color: #000;
				font-weight: bold;
				padding-bottom: 20rpx;
				/* 强制文本在一行显示 */
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
				min-width: 300rpx;
			}
		}
	}

	// 球员pk
	.leaderboard-title {
		width: 100%;
		display: flex;
		flex-wrap: nowrap;
		font-size: 22rpx;
		font-weight: 400;
		color: rgb(153, 153, 153);
		border-bottom: 2rpx solid #efefef;
		overflow: auto;

		.leaderboard-title-left {
			width: 20%;
		}

		.leaderboard-title-right {
			width: 100%;
			display: flex;
			align-items: center;
			justify-content: center;

			view {
				width: calc(100% / 5);
				text-align: center;
				font-size: 28rpx;
				padding: 10rpx 0;
				font-weight: 500;
			}
		}
	}

	.leaderboard-detail-right-box {
		width: 100%;
		display: flex;
		flex-wrap: wrap;

		.leaderboard-detail-right {
			width: 100%;
			height: 100%;
			display: flex;
			height: 80rpx;
			text-align: center;

			.left-box {
				width: 100%;
				display: flex;
				align-items: center;

				view {
					min-width: calc(100% / 5);
					text-align: center;
					display: flex;
					align-items: center;
					justify-content: center;
					// white-space: nowrap;
					// overflow: auto;
					// text-align: left;
					font-size: 22rpx;
				}

				image {
					width: 53rpx;
					height: 53rpx;
					border-radius: 50%;
				}
			}

			.right_box {
				background-color: green;

				.zhong-box {
					margin-left: 10px;
					display: flex;
				}

				.teamName-box {
					margin-left: auto;
					display: flex;
				}

				.changjun-box {
					margin-left: auto;
					display: flex;
				}

				.total-box {
					margin-left: auto;
					display: flex;
				}
			}
		}

		.leaderboard-detail-right:nth-child(odd) {
			background-color: #ff663321;
		}
	}

	.playerPk {
		display: flex;
		justify-content: space-around;
		align-items: center;
		background: #fff;
		padding: 30rpx;

		.p-1 {
			text-align: center;

			.playerImage {
				width: 180rpx;
				height: 180rpx;
			}

			.playerTitle {
				display: flex;
				align-items: center;
				justify-content: center;
				margin-top: 20rpx;

				text {
					font-weight: bold;
					font-size: 32rpx;
				}

				image {
					width: 34rpx;
					height: 34rpx;
					margin-left: 6rpx;
				}
			}
		}

		.p-2 {
			.p-2-item {
				display: flex;
				// align-items: center;
				margin-bottom: 10rpx;

				view {
					flex: 1;
					display: flex;
					align-items: center;
					justify-content: center;
					font-weight: bold;
					background: #eee;
					padding: 16rpx;
					font-size: 32rpx;
					// width: 60rpx;
					// height: 60rpx;
				}

				.p-2-left,
				.p-2-right {
					width: 80rpx;
					color: #999;
				}

				.p-2-center {
					white-space: nowrap;
					font-size: 24rpx !important;
				}

				.colorActive1 {
					color: #fff;
					background: #1C4187 !important;
				}

				.colorActive2 {
					color: #fff;
					background: #5A2C84 !important;
				}
			}
		}
	}

	.more-all-second {
		margin-top: 20rpx;
		display: flex;
		align-items: center;
		background: #F3F3F3;
		padding: 6rpx;
		border-radius: 40rpx;

		.more-second-tab {
			flex: 1;
			display: flex;
			align-items: center;
			justify-content: center;
			// height: 50rpx;
			padding: 10rpx 0;
		}

		.moreSecondActive {
			background: #fff;
			border-radius: 40rpx;
			border: 1rpx solid #eee;
		}
	}
</style>